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#030503
  • activityBar.border#1a331a
  • activityBar.foreground#39ff14
  • activityBar.inactiveForeground#76a376
  • activityBarBadge.background#39ff14
  • activityBarBadge.foreground#050805
  • badge.background#39ff14
  • badge.foreground#11111b
  • breadcrumb.activeSelectionForeground#39ff14
  • breadcrumb.focusForeground#39ff14
  • breadcrumb.foreground#76a376
  • button.background#39ff14
  • button.foreground#11111b
  • button.hoverBackground#32d911
  • dropdown.background#0a110a
  • dropdown.border#1a331a
  • dropdown.foreground#f0fff4
  • editor.background#050805
  • editor.findMatchBackground#39ff1470
  • editor.findMatchHighlightBackground#ccff0035
  • editor.foreground#f0fff4
  • editor.inactiveSelectionBackground#13221350
  • editor.selectionBackground#39ff1440
  • editor.selectionHighlightBackground#39ff1420
  • editor.wordHighlightBackground#ccff0025
  • editorCursor.foreground#39ff14
  • editorGroupHeader.border#1a331a
  • editorGroupHeader.tabsBackground#0a110a
  • editorLineNumber.activeForeground#39ff14
  • editorLineNumber.foreground#76a376
  • focusBorder#39ff14
  • foreground#f0fff4
  • gitDecoration.deletedResourceForeground#ff3860
  • gitDecoration.modifiedResourceForeground#ccff00
  • gitDecoration.untrackedResourceForeground#39ff14
  • input.background#0a110a
  • input.border#1a331a
  • input.foreground#f0fff4
  • input.placeholderForeground#76a376
  • list.activeSelectionBackground#13221380
  • list.activeSelectionForeground#39ff14
  • list.hoverBackground#132213
  • list.inactiveSelectionBackground#132213
  • sideBar.background#0a110a
  • sideBar.border#1a331a
  • sideBar.foreground#f0fff4
  • sideBarSectionHeader.background#030503
  • sideBarSectionHeader.foreground#39ff14
  • sideBarTitle.foreground#f0fff4
  • statusBar.background#020302
  • statusBar.debuggingBackground#ffaa00
  • statusBar.debuggingForeground#ffffff
  • statusBar.foreground#39ff14
  • statusBar.noFolderBackground#030503
  • statusBarItem.hoverBackground#132213
  • tab.activeBackground#050805
  • tab.activeBorder#39ff14
  • tab.activeForeground#f0fff4
  • tab.border#1a331a
  • tab.hoverBackground#132213
  • tab.inactiveBackground#0a110a
  • tab.inactiveForeground#76a376
  • terminal.ansiBlack#132213
  • terminal.ansiBlue#00e5ff
  • terminal.ansiBrightBlack#76a376
  • terminal.ansiBrightBlue#00e5ff
  • terminal.ansiBrightCyan#00e676
  • terminal.ansiBrightGreen#39ff14
  • terminal.ansiBrightMagenta#b9f6ca
  • terminal.ansiBrightRed#ff3860
  • terminal.ansiBrightWhite#f0fff4
  • terminal.ansiBrightYellow#ccff00
  • terminal.ansiCyan#00e676
  • terminal.ansiGreen#39ff14
  • terminal.ansiMagenta#b9f6ca
  • terminal.ansiRed#ff3860
  • terminal.ansiWhite#76a376
  • terminal.ansiYellow#ccff00
  • terminal.background#050805
  • terminal.foreground#f0fff4
  • terminalCursor.foreground#39ff14
  • titleBar.activeBackground#030503
  • titleBar.activeForeground#f0fff4
  • titleBar.border#1a331a
  • titleBar.inactiveBackground#050805
  • titleBar.inactiveForeground#76a376

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#466346italic
variable, string constant.other.placeholder#ccff00
constant.other.color#f0fff4
invalid, invalid.illegal#ff3860
keyword, storage.type, storage.modifier#b9f6ca
keyword.control, constant.other.color, punctuation, meta.tag, punctuation.definition.tag, punctuation.separator.inheritance.php, punctuation.definition.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, punctuation.section.embedded, keyword.other.template, keyword.other.substitution#ffaa00
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#ff3860
entity.name.function, meta.function-call, variable.function, support.function, keyword.other.special-method#00e5ff
meta.block variable.other#f0fff4
support.other.variable, string.other.link#00ff88
constant.numeric, constant.language, support.constant, constant.character, constant.escape, variable.parameter, keyword.other.unit, keyword.other#ffaa00
string, constant.other.symbol, constant.other.key, entity.other.inherited-class, markup.heading, markup.inserted.git_gutter, meta.group.braces.curly constant.other.object.key.js string.unquoted.label.js#39ff14
entity.name, support.type, support.class, support.other.namespace.use.php, meta.use.php, support.other.namespace.php, markup.changed.git_gutter, support.type.sys-types#ccff00
support.type#00e676
source.css support.type.property-name, source.sass support.type.property-name, source.scss support.type.property-name, source.less support.type.property-name, source.stylus support.type.property-name, source.postcss support.type.property-name#69f0ae
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#00e5ff
variable.language#ccff00italic
entity.name.method.js#00e5ffitalic
meta.class-method.js entity.name.function.js, variable.function.constructor#00e5ff
entity.other.attribute-name#69f0ae
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name#ffaa00italic
entity.other.attribute-name.class#69f0ae
source.sass keyword.control#00e5ff
markup.inserted#39ff14
markup.deleted#ff3860
markup.changed#00e5ff
string.regexp#00e676
constant.character.escape#00e676
*url*, *link*, *uri*underline
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js#b9f6caitalic
source.js constant.other.object.key.js string.unquoted.label.js#ffaa00italic
source.json meta.structure.dictionary.json support.type.property-name.json#00e5ff
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#b9f6ca
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#ff3860
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#ffaa00
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#39ff14
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#00e676
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#69f0ae
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#ccff00
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#00ffff
text.html.markdown, punctuation.definition.list_item.markdown#f0fff4
text.html.markdown markup.inline.raw.markdown#00ff88
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown#466346
markdown.heading, markup.heading | markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown#b9f6ca
markup.italic#00ff88italic
markup.bold, markup.bold string#b9f6cabold
markup.bold markup.italic, markup.italic markup.bold, markup.quote markup.bold, markup.bold markup.italic string, markup.italic markup.bold string, markup.quote markup.bold string#00ff88bold
markup.underline#00e5ffunderline
markup.quote punctuation.definition.blockquote.markdown#466346
markup.quoteitalic
string.other.link.title.markdown#00e5ff
string.other.link.description.title.markdown#b9f6ca
constant.other.reference.link.markdown#ffaa00
markup.raw.block#00ff88
markup.raw.block.fenced.markdown#f0fff415
punctuation.definition.fenced.markdown#f0fff415
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end#f0fff4
variable.language.fenced.markdown#466346
meta.separator#466346bold
markup.table#f0fff4