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#18171A
  • activityBar.border#1E1C21
  • activityBar.foreground#B3A996
  • activityBar.inactiveForeground#726B5D
  • editor.background#141316
  • editor.foreground#D8D1C3
  • editor.inactiveSelectionBackground#E89F5513
  • editor.lineHighlightBackground#1E1C21
  • editor.lineHighlightBorder#E89F5510
  • editor.selectionBackground#E89F5526
  • editorBracketMatch.background#E89F550A
  • editorBracketMatch.border#E89F5530
  • editorCursor.foreground#D49349
  • editorGutter.addedBackground#7AA88D
  • editorGutter.deletedBackground#C45D5D
  • editorGutter.modifiedBackground#B8943B
  • editorLineNumber.activeForeground#A19683
  • editorLineNumber.foreground#5F574B
  • editorWhitespace.foreground#2E2A26
  • focusBorder#E89F5525
  • list.activeSelectionBackground#3C352D55
  • list.hoverBackground#26222755
  • notifications.background#1C1A1F
  • notifications.foreground#D8D1C3
  • notificationsErrorIcon.foreground#C45D5D
  • sideBar.background#121113
  • sideBar.border#1E1C21
  • sideBar.foreground#A89E8A
  • statusBar.background#18171A
  • statusBar.border#1E1C21
  • statusBar.debuggingBackground#C45D5D33
  • statusBar.debuggingForeground#D8D1C3
  • statusBar.foreground#9E9483
  • tab.activeBackground#1C1A1F
  • tab.activeForeground#D8D1C3
  • tab.border#1E1C21
  • tab.hoverBackground#222025
  • tab.inactiveBackground#18171A
  • tab.inactiveForeground#8C8372
  • terminal.background#141316
  • terminal.foreground#D8D1C3
  • terminalCursor.background#D49349
  • titleBar.activeBackground#18171A
  • titleBar.activeForeground#CFC8B8
  • titleBar.border#1E1C21

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#726A5A
keyword, storage.type, storage.modifier#C99C46bold
variable, meta.definition.variable#E48FA3
string, constant.other.symbol#8DBE97
number, constant.numeric#CFA660
function, entity.name.function#C99C46
entity.name.class, support.class, meta.class#D9AE57bold
support.function, support.constant#8DBE97
constant.language, variable.language#E48FA3
invalid, invalid.illegal#D8D1C3
meta.tag, entity.name.tag#C99C46
entity.other.attribute-name#8DBE97
punctuation.definition.tag, punctuation.separator.key-value#8A7E6D
constant.character.escape#CFA660