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#1C1A19
  • activityBar.foreground#F4E285
  • activityBarBadge.background#EE6055
  • activityBarBadge.foreground#FAF3E0
  • editor.background#1C1A19
  • editor.foreground#F4E285
  • editor.inactiveSelectionBackground#BC4B5130
  • editor.lineHighlightBackground#403D3922
  • editor.selectionBackground#BC4B5160
  • editorBracketMatch.background#8CB36933
  • editorBracketMatch.border#8CB369
  • editorCursor.foreground#F4A259
  • editorIndentGuide.activeBackground#5B8E7D
  • editorIndentGuide.background#2D2A26
  • editorLineNumber.foreground#6B9080
  • panel.background#221F1E
  • panel.border#403D39
  • sideBar.background#221F1E
  • sideBar.foreground#A3CEF1
  • sideBarSectionHeader.background#2E2A26
  • statusBar.background#274C77
  • statusBar.debuggingBackground#BC4B51
  • statusBar.foreground#F4E285
  • tab.activeBackground#403D39
  • tab.activeForeground#F4E285
  • tab.border#221F1E
  • tab.inactiveBackground#2D2A26
  • tab.inactiveForeground#6B9080
  • terminal.background#1C1A19
  • terminal.foreground#F4E285
  • titleBar.activeBackground#2D2A26
  • titleBar.activeForeground#F5CB5C
  • titleBar.inactiveBackground#1C1A19
  • titleBar.inactiveForeground#6B9080

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#6B9080italic
keyword#EE6055bold
keyword.control, keyword.operator#EB5E28bold
string#8CB369
constant.numeric#F5CB5C
constant.language#F4A259
variable#F4E285
entity.name.function#5B8E7D
meta.function-call#5B8E7D
storage.type.function.arrow#1DD3B0
meta.function-call.arguments#086375
entity.name.type.class, support.class#EB5E28
entity.name.type.interface, support.type#A3CEF1
entity.name.type.parameter#F5CB5C
meta.object-literal.key#B2967D
variable.other.property#6096BA
meta.array#A4C3B2
variable.language.this#F4A259italic
entity.name.tag, meta.tag#EE6055
entity.other.attribute-name#5B8E7D
keyword.control.import, keyword.control.export#EB5E28

Shiki preview

TypeScript sample highlighted with this variant's colors and tokenColors.

Loading...

Candlelight Paper Theme - Coding Theme