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#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
Evergarden Theme by Ignacio Carrera - VS Code Theme