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.activeBorder#B0745E
  • activityBar.background#F2EFEB
  • activityBar.foreground#B0745E
  • activityBarBadge.background#B0745E
  • activityBarBadge.foreground#FAF8F3
  • badge.background#B0745E
  • badge.foreground#FAF8F3
  • button.background#B0745E
  • button.foreground#FAF8F3
  • button.hoverBackground#934E3F
  • dropdown.background#FFFFFF
  • dropdown.border#C0B29E
  • dropdown.foreground#3A352E
  • editor.background#FAF8F3
  • editor.findMatchBackground#B0745E44
  • editor.findMatchHighlightBackground#B0745E22
  • editor.foreground#3A352E
  • editor.lineHighlightBackground#B0745E20
  • editor.lineHighlightBorder#B0745E40
  • editor.selectionBackground#B0745E40
  • editor.selectionHighlightBackground#B0745E20
  • editorBracketMatch.background#B0745E33
  • editorBracketMatch.border#B0745E
  • editorCursor.foreground#B0745E
  • editorGroupHeader.tabsBackground#F2EFEB
  • editorIndentGuide.activeBackground#C0B29E88
  • editorIndentGuide.background#C0B29E44
  • editorLineNumber.activeForeground#B0745E
  • editorLineNumber.foreground#9A938A
  • editorWhitespace.foreground#C0B29E44
  • focusBorder#B0745E
  • gitDecoration.conflictingResourceForeground#C0B29E
  • gitDecoration.deletedResourceForeground#D64933
  • gitDecoration.modifiedResourceForeground#B0745E
  • gitDecoration.untrackedResourceForeground#7A9275
  • input.background#FFFFFF
  • input.border#C0B29E
  • input.foreground#3A352E
  • input.placeholderForeground#9A938A
  • inputOption.activeBorder#B0745E
  • list.activeSelectionBackground#B0745E66
  • list.activeSelectionForeground#FFFFFF
  • list.focusBackground#B0745E44
  • list.highlightForeground#B0745E
  • list.hoverBackground#B0745E33
  • minimap.background#FAF8F3
  • minimapSlider.activeBackground#B0745E66
  • minimapSlider.background#B0745E22
  • minimapSlider.hoverBackground#B0745E44
  • panel.background#FAF8F3
  • panel.border#C0B29E
  • panelTitle.activeBorder#B0745E
  • panelTitle.activeForeground#B0745E
  • panelTitle.inactiveForeground#9A938A
  • scrollbar.shadow#00000044
  • scrollbarSlider.activeBackground#B0745E88
  • scrollbarSlider.background#C0B29E44
  • scrollbarSlider.hoverBackground#C0B29E88
  • sideBar.background#F5F3EE
  • sideBar.foreground#3A352E
  • sideBarSectionHeader.background#EEEDEA
  • sideBarSectionHeader.foreground#B0745E
  • sideBarTitle.foreground#B0745E
  • statusBar.background#B0745E
  • statusBar.debuggingBackground#D32F2F
  • statusBar.foreground#FAF8F3
  • statusBar.noFolderBackground#C0B29E
  • statusBarItem.hoverBackground#934E3F
  • tab.activeBackground#FFFFFF
  • tab.activeBorder#B0745E
  • tab.activeForeground#3A352E
  • tab.border#C0B29E
  • tab.inactiveBackground#F2EFEB
  • tab.inactiveForeground#9A938A
  • terminal.ansiBlue#5A7E9F
  • terminal.ansiBrightBlue#6A8EBF
  • terminal.ansiBrightCyan#6AB9A0
  • terminal.ansiBrightGreen#8ABF87
  • terminal.ansiBrightMagenta#C78A7A
  • terminal.ansiBrightRed#E06C75
  • terminal.ansiBrightYellow#D9C68A
  • terminal.ansiCyan#5A9387
  • terminal.ansiGreen#7A9275
  • terminal.ansiMagenta#B0745E
  • terminal.ansiRed#D64933
  • terminal.ansiYellow#C0B29E
  • terminal.background#FAF8F3
  • terminal.foreground#3A352E
  • titleBar.activeBackground#EEEDEA
  • titleBar.activeForeground#3A352E
  • titleBar.inactiveBackground#F5F3EE
  • titleBar.inactiveForeground#9A938A

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#9A938Aitalic
string, string.quoted, string.template#7A9275
keyword, storage.type, storage.modifier#B0745Ebold
keyword.operator, punctuation.accessor#C0B29E
variable, variable.other#3A352E
variable.parameter#7A9275italic
entity.name.function, support.function#C0B29E
meta.function-call#B0745E
entity.name.class, entity.name.type.class, support.class#C0B29Ebold
entity.name.type, support.type#B0745E
entity.name.type.interface#7A9275italic
constant.numeric#7A9275
constant, constant.language, constant.character#C0B29E
constant.language.boolean#B0745Ebold
variable.other.property, support.variable.property#B0745E
meta.object-literal.key#C0B29E
entity.name.tag, punctuation.definition.tag#B0745E
entity.other.attribute-name#C0B29Eitalic
punctuation, meta.brace#3A352E
string.regexp#7A9275
constant.character.escape#C0B29E
meta.decorator, punctuation.decorator#B0745E
invalid, invalid.illegal#D64933strikethrough
markup.heading, entity.name.section#B0745Ebold
markup.bold#B0745Ebold
markup.italic#7A9275italic
markup.underline.link#C0B29E
markup.inline.raw, markup.fenced_code#7A9275
support.type.property-name.json#B0745E
entity.other.attribute-name.class.css, entity.other.attribute-name.id.css#C0B29E
support.type.property-name.css#B0745E
support.constant.property-value.css#7A9275