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#151514
  • activityBar.border#3D3D3B
  • activityBar.foreground#B89355
  • activityBar.inactiveForeground#4A463F
  • activityBarBadge.background#A33B39
  • activityBarBadge.foreground#F7F1E5
  • badge.background#A33B39
  • badge.foreground#F7F1E5
  • button.background#B89355
  • button.foreground#1C1C1B
  • editor.background#1C1C1B
  • editor.findMatchBackground#9D8A2988
  • editor.findMatchHighlightBackground#9D8A2933
  • editor.foreground#D1C7B7
  • editor.inactiveSelectionBackground#B8555522
  • editor.lineHighlightBackground#2D2D2A
  • editor.lineHighlightBorder#3D3D3B00
  • editor.selectionBackground#B8555544
  • editor.selectionHighlightBackground#B8935522
  • editorBracketHighlight.foreground1#C9A063
  • editorBracketHighlight.foreground2#6D95AD
  • editorBracketHighlight.foreground3#8DA37A
  • editorBracketHighlight.foreground4#A68656
  • editorBracketHighlight.foreground5#7A7469
  • editorBracketHighlight.foreground6#CF5A5A
  • editorBracketHighlight.unexpectedBracket.foreground#CF4232
  • editorCursor.foreground#B89355
  • editorGroup.border#3D3D3B
  • editorGroupHeader.tabsBackground#151514
  • editorHoverWidget.background#242423
  • editorIndentGuide.activeBackground1#4A463F
  • editorLineNumber.activeForeground#B89355
  • editorLineNumber.foreground#5C574F
  • editorLink.activeForeground#CF5A5A
  • editorSuggestWidget.background#242423
  • editorSuggestWidget.focusHighlightForeground#C9A063
  • editorSuggestWidget.highlightForeground#CF5A5A
  • editorSuggestWidget.selectedBackground#3D3D3B
  • editorWhitespace.foreground#3D3D3B
  • editorWidget.background#242423
  • editorWidget.border#B8935588
  • focusBorder#B89355
  • input.background#1C1C1B
  • input.border#3D3D3B
  • list.activeSelectionBackground#3D3D3B
  • list.activeSelectionForeground#F7F1E5
  • list.activeSelectionIconForeground#B89355
  • list.focusBackground#2D2D2A
  • list.focusForeground#CF5A5A
  • list.focusOutline#B89355
  • list.hoverBackground#2D2D2A
  • list.inactiveSelectionBackground#2D2D2A
  • list.inactiveSelectionForeground#D1C7B7
  • menu.background#242423
  • menu.border#3D3D3B
  • menu.foreground#D1C7B7
  • menu.selectionBackground#3D3D3B
  • menu.selectionForeground#B89355
  • pickerGroup.border#3D3D3B
  • pickerGroup.foreground#B89355
  • quickInput.background#242423
  • quickInput.foreground#D1C7B7
  • quickInputList.focusBackground#3D3D3B
  • quickInputTitle.background#151514
  • scrollbarSlider.activeBackground#B8935588
  • scrollbarSlider.background#B8935522
  • scrollbarSlider.hoverBackground#B8935544
  • sideBar.background#151514
  • sideBar.border#3D3D3B
  • sideBar.foreground#8E887D
  • statusBar.background#151514
  • statusBar.debuggingBackground#151514
  • statusBar.debuggingBorder#CF5A5A
  • statusBar.debuggingForeground#CF5A5A
  • statusBar.foreground#B5AFA2
  • statusBar.noFolderBackground#151514
  • statusBar.noFolderBorder#B89355
  • statusBar.noFolderForeground#B89355
  • tab.activeBackground#1C1C1B
  • tab.activeForeground#F7F1E5
  • tab.border#3D3D3B
  • tab.inactiveBackground#151514
  • tab.inactiveForeground#6E685E
  • textLink.activeForeground#CF5A5A
  • textLink.foreground#B89355
  • titleBar.activeBackground#151514
  • titleBar.activeForeground#D1C7B7
  • titleBar.border#3D3D3B
  • titleBar.inactiveBackground#151514

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment, unused#7A7469italic
keyword, storage.type, storage.modifier, variable.language, constant.language#C9A063bold
string, punctuation.definition.string#8DA37A
constant.numeric, constant.character, constant.other#CF5A5A
entity.name.function, support.function, variable.function, meta.function-call#7194D6
entity.name.type, entity.name.class, support.type, support.class, entity.other.inherited-class#A1B2BC
variable, variable.other, variable.parameter, support.variable, variable.other.property, variable.other.object.property#D1C7B7
punctuation, meta.brace, meta.delimiter, punctuation.definition.parameters, punctuation.terminator, punctuation.separator#5C574F
entity.name.tag, meta.tag, punctuation.definition.tag, markup.heading#B3782C