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#1F2428
  • activityBar.foreground#D6CBB4
  • activityBarBadge.background#E67E80
  • activityBarBadge.foreground#252B2E
  • editor.background#252B2E
  • editor.foreground#D6CBB4
  • editor.lineHighlightBackground#2A3033
  • editor.selectionBackground#3A4045
  • editor.selectionHighlightBackground#3A4045
  • editorCodeLens.foreground#859289
  • editorCursor.foreground#D6CBB4
  • editorIndentGuide.activeBackground#859289
  • editorIndentGuide.background#3A4045
  • editorLineNumber.activeForeground#D6CBB4
  • editorLineNumber.foreground#859289
  • editorRuler.foreground#3A4045
  • editorWhitespace.foreground#3A4045
  • minimap.background#252B2E
  • panel.background#1F2428
  • panel.border#3A4045
  • panelTitle.activeForeground#D6CBB4
  • panelTitle.inactiveForeground#859289
  • scrollbarSlider.activeBackground#859289
  • scrollbarSlider.background#3A404580
  • scrollbarSlider.hoverBackground#3A404590
  • sideBar.background#1F2428
  • sideBar.foreground#D6CBB4
  • sideBarSectionHeader.background#252B2E
  • sideBarSectionHeader.foreground#D6CBB4
  • statusBar.background#1F2428
  • statusBar.debuggingBackground#E67E80
  • statusBar.debuggingForeground#252B2E
  • statusBar.foreground#D6CBB4
  • statusBar.noFolderBackground#1F2428
  • tab.activeBackground#252B2E
  • tab.activeForeground#D6CBB4
  • tab.border#3A4045
  • tab.inactiveBackground#1F2428
  • tab.inactiveForeground#859289
  • terminal.ansiBlack#232a2e
  • terminal.ansiBlue#95aee1
  • terminal.ansiBrightBlack#44535a
  • terminal.ansiBrightBlue#b5ccec
  • terminal.ansiBrightCyan#9be0d9
  • terminal.ansiBrightGreen#cae0a7
  • terminal.ansiBrightMagenta#f3c0e5
  • terminal.ansiBrightRed#faa7a9
  • terminal.ansiBrightWhite#e2e9eb
  • terminal.ansiBrightYellow#f1d09e
  • terminal.ansiCyan#78d0ca
  • terminal.ansiGreen#b2d185
  • terminal.ansiMagenta#e680c8
  • terminal.ansiRed#f57f82
  • terminal.ansiWhite#a3b8bd
  • terminal.ansiYellow#f2c27f
  • terminal.background#252B2E
  • terminal.foreground#D6CBB4
  • titleBar.activeBackground#1F2428
  • titleBar.activeForeground#D6CBB4
  • titleBar.inactiveBackground#1F2428
  • titleBar.inactiveForeground#859289

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#859289italic
comment.block.preprocessor, comment.line.preprocessor#E67E80
keyword, storage.type, storage.modifier#E67E80
keyword.type, storage.type.primitive, support.type, entity.name.type#DBBC7F
entity.name.function, meta.function-call, variable.function, support.function#B2C98F
variable, variable.other, variable.parameter#D6CBB4
support.function.builtin, support.constant.builtin, variable.language#D699B6
constant, constant.numeric, constant.language, constant.character.escape#D699B6
constant.numeric, constant.numeric.integer, constant.numeric.float#D699B6
string, string.quoted, string.template#B2C98F
string.quoted.symbol, constant.other.symbol#E69875
keyword.operator, punctuation.separator, punctuation.terminator#7a8478
entity.other.attribute-name, meta.attribute#D699B6bold
entity.name.tag, punctuation.definition.tag#7a8478
entity.name, entity.other.inherited-class#DBBC7F
entity.name.exception, support.type.exception#E67E80
entity.name.label#E67E80
markup.deleted, markup.deleted.diff#E67E80
markup.inserted, markup.inserted.diff#B2C98F
markup.heading, entity.name.section#D699B6bold
markup.heading.2, markup.heading.3, markup.heading.4, markup.heading.5, markup.heading.6#B2C98Fbold
markup.italic#6E8585
markup.bold#D6CBB4
invalid, invalid.illegal#252B2Ebold