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#2a2920
  • activityBar.border#ffffff15
  • activityBar.foreground#f3d21b
  • activityBar.inactiveForeground#fbf6da60
  • activityBarBadge.background#f3d21b
  • activityBarBadge.foreground#2a2920
  • button.background#f3d21b
  • button.foreground#2a2920
  • button.hoverBackground#f3d21bdd
  • editor.background#2a2920
  • editor.foreground#fbf6da
  • editor.inactiveSelectionBackground#6f8f573580
  • editor.lineHighlightBackground#17160f40
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#6f8f5735
  • editorCursor.foreground#f3d21b
  • editorGroupHeader.tabsBackground#2a2920dd
  • editorLineNumber.activeForeground#f3d21b
  • editorLineNumber.foreground#d7dcc180
  • focusBorder#f3d21b
  • foreground#fbf6da
  • input.background#17160f
  • input.border#ffffff15
  • input.foreground#fbf6da
  • input.placeholderForeground#fbf6da60
  • list.activeSelectionBackground#f3d21b30
  • list.activeSelectionForeground#fbf6da
  • list.highlightForeground#f3d21b
  • list.hoverBackground#17160f40
  • list.hoverForeground#fbf6da
  • list.inactiveSelectionBackground#f3d21b15
  • list.inactiveSelectionForeground#fbf6da
  • selection.background#6f8f5735
  • sideBar.background#17160f
  • sideBar.border#ffffff15
  • sideBar.foreground#fbf6da
  • sideBarSectionHeader.background#2a292080
  • sideBarSectionHeader.foreground#fbf6da
  • sideBarTitle.foreground#f3d21b
  • statusBar.background#2a2920
  • statusBar.border#ffffff15
  • statusBar.foreground#fbf6da
  • statusBar.noFolderBackground#2a2920
  • tab.activeBackground#2a2920
  • tab.activeBorderTop#f3d21b
  • tab.activeForeground#fbf6da
  • tab.border#ffffff15
  • tab.inactiveBackground#17160f60
  • tab.inactiveForeground#fbf6da80
  • terminal.ansiBlack#2a2920
  • terminal.ansiBlue#6f8f57
  • terminal.ansiCyan#fffbe8
  • terminal.ansiGreen#f3d21b
  • terminal.ansiMagenta#a7b46a
  • terminal.ansiRed#a7b46a
  • terminal.ansiWhite#fbf6da
  • terminal.ansiYellow#fffbe8
  • terminal.background#2a2920
  • terminal.foreground#fbf6da
  • titleBar.activeBackground#2a2920
  • titleBar.activeForeground#fbf6da
  • titleBar.border#ffffff15
  • titleBar.inactiveBackground#2a2920
  • titleBar.inactiveForeground#fbf6da60
  • widget.border#ffffff15

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#d7dcc1italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#6f8f57bold
storage.type, storage.modifier#6f8f57italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#f3d21b
string, punctuation.definition.string, string.template, meta.template.expression#fffbe8
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#a7b46a
variable, variable.other.readwrite, variable.other.object#fbf6da
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#fbf6da
variable.parameter, meta.parameter#fbf6dadditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#fbf6da80
keyword.operator#fbf6da
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#fffbe8bold
entity.other.inherited-class#f3d21b
entity.name.tag, punctuation.definition.tag#6f8f57
entity.other.attribute-name#f3d21b
meta.diff, meta.diff.header#d7dcc1
markup.deleted#a7b46a
markup.inserted#f3d21b
markup.changed#fffbe8
markup.heading, markup.heading.setext, punctuation.definition.heading#f3d21bbold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#fffbe8
string.other.link.title, string.other.link.description#f3d21b
markup.underline.link#d7dcc1underline
punctuation.definition.list#6f8f57
markup.quote, punctuation.definition.quote#d7dcc1italic
Morphous Theme by Ameyanagi - VS Code Theme