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#000000
  • activityBar.border#1a1500
  • activityBar.foreground#ffcc55
  • activityBarBadge.background#e5b935
  • editor.background#000000
  • editor.foreground#e0e0e0
  • editorBracketHighlight.foreground1#ffcc2b
  • editorBracketHighlight.foreground2#ffdd44
  • editorBracketHighlight.foreground3#ffee66
  • editorBracketHighlight.foreground4#cc9900
  • editorBracketHighlight.foreground5#997700
  • editorBracketHighlight.foreground6#665500
  • editorBracketPairGuide.activeBackground1#ffcc2b
  • editorBracketPairGuide.activeBackground2#ffdd44
  • editorBracketPairGuide.activeBackground3#ffee66
  • editorBracketPairGuide.activeBackground4#cc9900
  • editorBracketPairGuide.activeBackground5#997700
  • editorBracketPairGuide.activeBackground6#665500
  • editorBracketPairGuide.background1#ffcc2b44
  • editorBracketPairGuide.background2#ffdd4444
  • editorBracketPairGuide.background3#ffee6644
  • editorBracketPairGuide.background4#cc990044
  • editorBracketPairGuide.background5#99770044
  • editorBracketPairGuide.background6#66550044
  • editorGroupHeader.tabsBackground#000000
  • menubar.selectionBackground#221a00
  • menubar.selectionForeground#ffee66
  • panel.background#000000
  • panel.border#1a1500
  • sideBar.background#000000
  • sideBar.border#1a1500
  • sideBar.foreground#e0e0e0
  • sideBarTitle.foreground#ffcc55
  • statusBar.background#000000
  • statusBar.border#1a1500
  • statusBar.foreground#ffcc55
  • tab.activeBackground#000000
  • tab.activeForeground#ffcc55
  • tab.border#1a1500
  • tab.inactiveBackground#050505
  • tab.inactiveForeground#887744
  • terminal.background#000000
  • titleBar.activeBackground#000000
  • titleBar.activeForeground#ffcc55
  • titleBar.inactiveBackground#050505
  • titleBar.inactiveForeground#887733

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#8B7B2Eitalic
variable, string constant.other.placeholder#e0e0e0
constant.other.color#ffee66
invalid, invalid.illegal#ffbb33
keyword, storage.type, storage.modifier#ffdd44
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#ffee66
punctuation.definition.block, punctuation.section.block, meta.brace.curly, punctuation.definition.arguments.begin, punctuation.definition.arguments.end#ffdd5a
punctuation.definition.bracket.square, meta.brace.square, punctuation.section.brackets, punctuation.definition.array#ffdd5a
punctuation.definition.parameters, punctuation.section.parameters, meta.brace.round, punctuation.definition.group#ffdd5a
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#ffcc55
entity.name.function, meta.function-call, variable.function, support.function, keyword.other.special-method#ffaa43
meta.block variable.other#ffdd77
support.other.variable, string.other.link#ffdd77
constant.numeric, constant.language, support.constant, constant.character, constant.escape, variable.parameter, keyword.other.unit, keyword.other#ffcc42
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#ffeeaa
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#ffcc66
support.type#ffdd88
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#ffdd88
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#ffbb4d
variable.language#ffbb4ditalic
entity.name.method.js#ffbb55italic
meta.class-method.js entity.name.function.js, variable.function.constructor#ffbb55
entity.other.attribute-name#ffdd77
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name#ffcc66italic
entity.other.attribute-name.class#ffcc66
source.sass keyword.control#ffbb55
markup.inserted#ffeeaa
markup.deleted#ffbb33
markup.changed#ffee66
string.regexp#ffdd88
constant.character.escape#ffdd88
*url*, *link*, *uri*#ffeeaaunderline
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js#ffbb55italic
source.js constant.other.object.key.js string.unquoted.label.js#ffbb4ditalic
source.json meta.structure.dictionary.json support.type.property-name.json#ffbb4d
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#ffee66
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#ff8080
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#ffee99
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#ffeeb3
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#fff4cc
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#ffbb33
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#ffcc55
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#ffdd77
text.html.markdown, punctuation.definition.list_item.markdown#e0e0e0
text.html.markdown markup.inline.raw.markdown#ffdd88
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown#8a7a6a
markdown.heading, markup.heading | markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown#ffeeaa
markup.italic#ffdd88italic
markup.bold, markup.bold string#ffdd88bold
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#ffdd88bold
markup.underline#ffcc42underline
markup.quote punctuation.definition.blockquote.markdown#8a7a6a
markup.quoteitalic
string.other.link.title.markdown#ffbb55
string.other.link.description.title.markdown#ffdd88
constant.other.reference.link.markdown#ffcc66
markup.raw.block#ffdd88
markup.raw.block.fenced.markdown#4a3a2a
punctuation.definition.fenced.markdown#4a3a2a
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end#e0e0e0
variable.language.fenced.markdown#8a7a6a
meta.separator#8a7a6abold
markup.table#e0e0e0