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#4A3C2E
  • activityBar.border#ffffff15
  • activityBar.foreground#1F7A4C
  • activityBar.inactiveForeground#F7FAF860
  • activityBarBadge.background#1F7A4C
  • activityBarBadge.foreground#4A3C2E
  • button.background#1F7A4C
  • button.foreground#4A3C2E
  • button.hoverBackground#1F7A4Cdd
  • editor.background#4A3C2E
  • editor.foreground#F7FAF8
  • editor.inactiveSelectionBackground#4C8D3A3580
  • editor.lineHighlightBackground#0E141240
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#4C8D3A35
  • editorCursor.foreground#1F7A4C
  • editorGroupHeader.tabsBackground#4A3C2Edd
  • editorLineNumber.activeForeground#1F7A4C
  • editorLineNumber.foreground#A8B3AE80
  • focusBorder#1F7A4C
  • foreground#F7FAF8
  • input.background#0E1412
  • input.border#ffffff15
  • input.foreground#F7FAF8
  • input.placeholderForeground#F7FAF860
  • list.activeSelectionBackground#1F7A4C30
  • list.activeSelectionForeground#F7FAF8
  • list.highlightForeground#1F7A4C
  • list.hoverBackground#0E141240
  • list.hoverForeground#F7FAF8
  • list.inactiveSelectionBackground#1F7A4C15
  • list.inactiveSelectionForeground#F7FAF8
  • selection.background#4C8D3A35
  • sideBar.background#0E1412
  • sideBar.border#ffffff15
  • sideBar.foreground#F7FAF8
  • sideBarSectionHeader.background#4A3C2E80
  • sideBarSectionHeader.foreground#F7FAF8
  • sideBarTitle.foreground#1F7A4C
  • statusBar.background#4A3C2E
  • statusBar.border#ffffff15
  • statusBar.foreground#F7FAF8
  • statusBar.noFolderBackground#4A3C2E
  • tab.activeBackground#4A3C2E
  • tab.activeBorderTop#1F7A4C
  • tab.activeForeground#F7FAF8
  • tab.border#ffffff15
  • tab.inactiveBackground#0E141260
  • tab.inactiveForeground#F7FAF880
  • terminal.ansiBlack#4A3C2E
  • terminal.ansiBlue#4C8D3A
  • terminal.ansiCyan#2B3A2E
  • terminal.ansiGreen#1F7A4C
  • terminal.ansiMagenta#C47A3A
  • terminal.ansiRed#C47A3A
  • terminal.ansiWhite#F7FAF8
  • terminal.ansiYellow#2B3A2E
  • terminal.background#4A3C2E
  • terminal.foreground#F7FAF8
  • titleBar.activeBackground#4A3C2E
  • titleBar.activeForeground#F7FAF8
  • titleBar.border#ffffff15
  • titleBar.inactiveBackground#4A3C2E
  • titleBar.inactiveForeground#F7FAF860
  • widget.border#ffffff15

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#A8B3AEitalic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#4C8D3Abold
storage.type, storage.modifier#4C8D3Aitalic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#1F7A4C
string, punctuation.definition.string, string.template, meta.template.expression#2B3A2E
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#C47A3A
variable, variable.other.readwrite, variable.other.object#F7FAF8
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#F7FAF8
variable.parameter, meta.parameter#F7FAF8dditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#F7FAF880
keyword.operator#F7FAF8
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#2B3A2Ebold
entity.other.inherited-class#1F7A4C
entity.name.tag, punctuation.definition.tag#4C8D3A
entity.other.attribute-name#1F7A4C
meta.diff, meta.diff.header#A8B3AE
markup.deleted#C47A3A
markup.inserted#1F7A4C
markup.changed#2B3A2E
markup.heading, markup.heading.setext, punctuation.definition.heading#1F7A4Cbold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#2B3A2E
string.other.link.title, string.other.link.description#1F7A4C
markup.underline.link#A8B3AEunderline
punctuation.definition.list#4C8D3A
markup.quote, punctuation.definition.quote#A8B3AEitalic