Skip to main content
Coding Theme

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#2a1c1d
  • activityBar.foreground#c73a3c
  • activityBar.inactiveForeground#8a5f61
  • activityBarBadge.background#8f2527
  • activityBarBadge.foreground#f4dede
  • badge.background#8f2527
  • badge.foreground#f4dede
  • editor.background#1c1414
  • editor.foreground#d9bcbc
  • editor.inactiveSelectionBackground#a88e9026
  • editor.lineHighlightBackground#a88e9018
  • editor.lineHighlightBorder#2a1c1d
  • editor.selectionBackground#bb444440
  • editor.wordHighlightBackground#a88e9018
  • editor.wordHighlightStrongBackground#a88e9026
  • editorBracketMatch.background#c73a3c40
  • editorBracketMatch.border#c73a3c
  • editorCursor.foreground#c73a3c
  • editorError.foreground#ff6d6d
  • editorGutter.addedBackground#587c0c
  • editorGutter.background#1c1414
  • editorGutter.deletedBackground#94151b
  • editorGutter.modifiedBackground#0c7d9d
  • editorIndentGuide.activeBackground#c73a3c
  • editorIndentGuide.background#5f3a3b
  • editorInfo.foreground#7ee2ff
  • editorLineNumber.activeForeground#f4dede
  • editorLineNumber.foreground#a88e90
  • editorWarning.foreground#ffd668
  • focusBorder#c73a3c
  • foreground#d9bcbc
  • list.activeSelectionBackground#4b0e0f
  • list.activeSelectionForeground#f4dede
  • list.hoverBackground#8f252730
  • list.inactiveSelectionBackground#8f252766
  • list.inactiveSelectionForeground#ffffff
  • selection.background#bb444430
  • sideBar.background#1f1819
  • sideBar.foreground#bfa4a6
  • sideBarSectionHeader.background#8f2527
  • sideBarSectionHeader.foreground#f4dede
  • statusBar.background#2a1c1d
  • statusBar.foreground#bfa4a6
  • statusBarItem.remoteBackground#c73a3c
  • statusBarItem.remoteForeground#f4dede
  • tab.activeBackground#1c1414
  • tab.activeForeground#f4dede
  • tab.hoverBorder#c73a3c
  • tab.inactiveBackground#2a1c1d
  • tab.inactiveForeground#bfa4a6
  • terminal.ansiBlack#000000
  • terminal.ansiBlue#74bcff
  • terminal.ansiBrightBlue#9cd0ff
  • terminal.ansiBrightCyan#74f2ff
  • terminal.ansiBrightGreen#9affb2
  • terminal.ansiBrightMagenta#ec84ff
  • terminal.ansiBrightRed#ff6d6d
  • terminal.ansiBrightWhite#ffffff
  • terminal.ansiBrightYellow#ffe05b
  • terminal.ansiCyan#39cde2
  • terminal.ansiGreen#67ff8a
  • terminal.ansiMagenta#e557f9
  • terminal.ansiRed#ff5a5a
  • terminal.ansiWhite#d4d4d4
  • terminal.ansiYellow#e1c542
  • terminal.foreground#d9bcbc
  • terminalCursor.foreground#f4dede
  • titleBar.activeBackground#2a1c1d
  • titleBar.activeForeground#d9bcbc
  • titleBar.inactiveBackground#2a1c1d
  • titleBar.inactiveForeground#bfa4a6

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#7a6c6ditalic
invalid, invalid.illegal#ff6d6d
keyword, storage.type, storage.modifier, keyword.control#c678dd
keyword.operator, punctuation.separator.key-value, punctuation.separator.comma, punctuation.section.embedded#56b6c2
entity.name.function, support.function, variable.function, meta.function-call, meta.function-call.generic#61afef
variable, meta.definition.variable.name#d9bcbc
variable.parameter#bfa4a6
string, constant.other.symbol#98c379
constant.numeric, constant.language, constant.character, constant.escape#d19a66
support.type, entity.name.type, entity.name.class, support.class#e5c07b
entity.name.tag#c73a3c
entity.other.attribute-name#d19a66
support.type.property-name.json#c73a3c
markup.heading, markup.heading punctuation.definition.heading#e5c07b
entity.name.package.go#e5c07b
support.type.builtin.go#e5c07b
keyword.operator.assignment.go, keyword.operator.arithmetic.go, keyword.operator.address.go#56b6c2
meta.function.decorator.python, support.token.decorator.python#61afef
support.variable.magic.python#c73a3c
punctuation.separator.period.python, punctuation.separator.element.python, punctuation.parenthesis.begin.python, punctuation.parenthesis.end.python#a88e90
meta.function-call.generic.python#61afef
constant.character.format.placeholder.other.python#d19a66
support.type.primitive.ts, support.type.builtin.ts, support.type.primitive.tsx, support.type.builtin.tsx#e5c07b
entity.name.type.ts, entity.name.interface.ts#e5c07b
keyword.operator.expression.import#61afef
variable.other.property, support.variable.property#d9bcbc
rediohead theme by ChiliMelon - VS Code Theme