Skip to main content
Coding Theme

Color themes

VS Code preview

Full workbench mockup using this variant's colors and tokenColors.

Loading...

colors

Workbench UI color keys from the theme JSON colors map.

  • activityBar.background#EAF3F5
  • activityBar.border#00000015
  • activityBar.foreground#1F5B45
  • activityBar.inactiveForeground#10231C60
  • activityBarBadge.background#1F5B45
  • activityBarBadge.foreground#EAF3F5
  • button.background#1F5B45
  • button.foreground#EAF3F5
  • button.hoverBackground#1F5B45dd
  • editor.background#EAF3F5
  • editor.foreground#10231C
  • editor.inactiveSelectionBackground#7FB5C62580
  • editor.lineHighlightBackground#F7FBFA50
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#7FB5C625
  • editorCursor.foreground#1F5B45
  • editorGroupHeader.tabsBackground#F7FBFAaa
  • editorLineNumber.activeForeground#1F5B45
  • editorLineNumber.foreground#8A9A8F80
  • focusBorder#1F5B45
  • foreground#10231C
  • input.background#F7FBFA
  • input.border#00000015
  • input.foreground#10231C
  • input.placeholderForeground#10231C60
  • list.activeSelectionBackground#1F5B4530
  • list.activeSelectionForeground#10231C
  • list.highlightForeground#1F5B45
  • list.hoverBackground#F7FBFA40
  • list.hoverForeground#10231C
  • list.inactiveSelectionBackground#1F5B4515
  • list.inactiveSelectionForeground#10231C
  • selection.background#7FB5C625
  • sideBar.background#F7FBFA
  • sideBar.border#00000015
  • sideBar.foreground#10231C
  • sideBarSectionHeader.background#F7FBFA80
  • sideBarSectionHeader.foreground#10231C
  • sideBarTitle.foreground#1F5B45
  • statusBar.background#EAF3F5
  • statusBar.border#00000015
  • statusBar.foreground#10231C
  • statusBar.noFolderBackground#EAF3F5
  • tab.activeBackground#EAF3F5
  • tab.activeBorderTop#1F5B45
  • tab.activeForeground#10231C
  • tab.border#00000015
  • tab.inactiveBackground#EAF3F560
  • tab.inactiveForeground#10231C80
  • terminal.ansiBlack#10231C
  • terminal.ansiBlue#7FB5C6
  • terminal.ansiCyan#4F8A5F
  • terminal.ansiGreen#1F5B45
  • terminal.ansiMagenta#173C32
  • terminal.ansiRed#173C32
  • terminal.ansiWhite#10231C
  • terminal.ansiYellow#4F8A5F
  • terminal.background#EAF3F5
  • terminal.foreground#10231C
  • titleBar.activeBackground#EAF3F5
  • titleBar.activeForeground#10231C
  • titleBar.border#00000015
  • titleBar.inactiveBackground#EAF3F5
  • titleBar.inactiveForeground#10231C60
  • widget.border#00000015

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#8A9A8Fitalic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#7FB5C6bold
storage.type, storage.modifier#7FB5C6italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#1F5B45
string, punctuation.definition.string, string.template, meta.template.expression#4F8A5F
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#173C32
variable, variable.other.readwrite, variable.other.object#10231C
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#10231C
variable.parameter, meta.parameter#10231Cdditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#10231C80
keyword.operator#10231C
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#4F8A5Fbold
entity.other.inherited-class#1F5B45
entity.name.tag, punctuation.definition.tag#7FB5C6
entity.other.attribute-name#1F5B45
meta.diff, meta.diff.header#8A9A8F
markup.deleted#173C32
markup.inserted#1F5B45
markup.changed#4F8A5F
markup.heading, markup.heading.setext, punctuation.definition.heading#1F5B45bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#4F8A5F
string.other.link.title, string.other.link.description#1F5B45
markup.underline.link#8A9A8Funderline
punctuation.definition.list#7FB5C6
markup.quote, punctuation.definition.quote#8A9A8Fitalic