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#001a00
  • activityBar.foreground#55ff55
  • activityBarBadge.background#39e535
  • editor.background#000000
  • editor.foreground#e0e0e0
  • editorBracketHighlight.foreground1#2bff2b
  • editorBracketHighlight.foreground2#44ff44
  • editorBracketHighlight.foreground3#66ff66
  • editorBracketHighlight.foreground4#00cc00
  • editorBracketHighlight.foreground5#009900
  • editorBracketHighlight.foreground6#006600
  • editorBracketPairGuide.activeBackground1#2bff2b
  • editorBracketPairGuide.activeBackground2#44ff44
  • editorBracketPairGuide.activeBackground3#66ff66
  • editorBracketPairGuide.activeBackground4#00cc00
  • editorBracketPairGuide.activeBackground5#009900
  • editorBracketPairGuide.activeBackground6#006600
  • editorBracketPairGuide.background1#2bff2b44
  • editorBracketPairGuide.background2#44ff4444
  • editorBracketPairGuide.background3#66ff6644
  • editorBracketPairGuide.background4#00cc0044
  • editorBracketPairGuide.background5#00990044
  • editorBracketPairGuide.background6#00660044
  • editorGroupHeader.tabsBackground#000000
  • menubar.selectionBackground#002200
  • menubar.selectionForeground#66ff66
  • panel.background#000000
  • panel.border#001a00
  • sideBar.background#000000
  • sideBar.border#001a00
  • sideBar.foreground#e0e0e0
  • sideBarTitle.foreground#55ff55
  • statusBar.background#000000
  • statusBar.border#001a00
  • statusBar.foreground#55ff55
  • tab.activeBackground#000000
  • tab.activeForeground#55ff55
  • tab.border#001a00
  • tab.inactiveBackground#050505
  • tab.inactiveForeground#448844
  • terminal.background#000000
  • titleBar.activeBackground#000000
  • titleBar.activeForeground#55ff55
  • titleBar.inactiveBackground#050505
  • titleBar.inactiveForeground#338833

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#2E8B2Eitalic
variable, string constant.other.placeholder#e0e0e0
constant.other.color#66ff66
invalid, invalid.illegal#33ff33
keyword, storage.type, storage.modifier#44ff44
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#66ff66
punctuation.definition.block, punctuation.section.block, meta.brace.curly, punctuation.definition.arguments.begin, punctuation.definition.arguments.end#5aff5a
punctuation.definition.bracket.square, meta.brace.square, punctuation.section.brackets, punctuation.definition.array#5aff5a
punctuation.definition.parameters, punctuation.section.parameters, meta.brace.round, punctuation.definition.group#5aff5a
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#55ff55
entity.name.function, meta.function-call, variable.function, support.function, keyword.other.special-method#70ff43
meta.block variable.other#77ff77
support.other.variable, string.other.link#77ff77
constant.numeric, constant.language, support.constant, constant.character, constant.escape, variable.parameter, keyword.other.unit, keyword.other#8cff42
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#aaffaa
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#aaff66
support.type#aaff88
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#aaff88
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#4dff4d
variable.language#4dff4ditalic
entity.name.method.js#88ff55italic
meta.class-method.js entity.name.function.js, variable.function.constructor#88ff55
entity.other.attribute-name#77ffaa
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name#aaff66italic
entity.other.attribute-name.class#aaff66
source.sass keyword.control#88ff55
markup.inserted#aaffaa
markup.deleted#33ff33
markup.changed#66ff66
string.regexp#88ff88
constant.character.escape#88ff88
*url*, *link*, *uri*#aaffaaunderline
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js#88ff55italic
source.js constant.other.object.key.js string.unquoted.label.js#4dff4ditalic
source.json meta.structure.dictionary.json support.type.property-name.json#4dff4d
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#66ff66
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#99ff99
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#b3ffb3
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#ccffcc
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#33ff33
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#55ff55
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#77ff77
text.html.markdown, punctuation.definition.list_item.markdown#e0e0e0
text.html.markdown markup.inline.raw.markdown#88ff88
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown#6a8a6a
markdown.heading, markup.heading | markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown#aaffaa
markup.italic#88ff88italic
markup.bold, markup.bold string#88ff88bold
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#88ff88bold
markup.underline#8cff42underline
markup.quote punctuation.definition.blockquote.markdown#6a8a6a
markup.quoteitalic
string.other.link.title.markdown#88ff55
string.other.link.description.title.markdown#88ff88
constant.other.reference.link.markdown#aaff66
markup.raw.block#88ff88
markup.raw.block.fenced.markdown#2a4a2a
punctuation.definition.fenced.markdown#2a4a2a
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end#e0e0e0
variable.language.fenced.markdown#6a8a6a
meta.separator#6a8a6abold
markup.table#e0e0e0