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#2F2F2B
  • activityBar.foreground#fed506
  • activityBarBadge.background#fed506
  • activityBarBadge.foreground#2F2F2B
  • badge.background#2F2F2B
  • button.background#2F2F2B
  • debugToolBar.background#2f343f
  • diffEditor.insertedTextBackground#00809b33
  • dropdown.background#fed506
  • dropdown.border#fed506
  • dropdown.foreground#00003C
  • editor.background#2F2F2B
  • editor.findMatchHighlightBackground#4e4f53
  • editor.foreground#dfdfdf
  • editor.inactiveSelectionBackground#3a3d41
  • editor.lineHighlightBackground#434340
  • editor.selectionBackground#3e4451
  • editor.selectionHighlightBackground#add6ff26
  • editorCodeLens.foreground#89949a
  • editorCursor.foreground#f8f8f0
  • editorError.foreground#90110f
  • editorGroup.border#00003C
  • editorGroupHeader.tabsBackground#434340
  • editorHoverWidget.background#2f343f
  • editorHoverWidget.border#181a1f
  • editorIndentGuide.background#3b4048
  • editorLineNumber.foreground#495162
  • editorMarkerNavigation.background#2f343f
  • editorRuler.foreground#abb2bf26
  • editorSuggestWidget.background#2f343f
  • editorSuggestWidget.border#181a1f
  • editorSuggestWidget.selectedBackground#21252b
  • editorWhitespace.foreground#3b4048
  • editorWidget.background#2f343f
  • foreground#fffbdd
  • gitDecoration.ignoredResourceForeground#89949a
  • input.background#00003C
  • input.border#00003C
  • input.foreground#fffbdd
  • input.placeholderForeground#e4eef4
  • list.activeSelectionBackground#434340
  • list.activeSelectionForeground#fed506
  • list.dropBackground#2F2F2B
  • list.focusBackground#434340
  • list.highlightForeground#c5c5c5
  • list.hoverBackground#434340
  • list.inactiveSelectionBackground#434340
  • list.inactiveSelectionForeground#fed506
  • peekView.border#2F2F2B
  • peekViewEditor.background#434340
  • peekViewEditor.matchHighlightBackground#2F2F2B
  • peekViewEditorGutter.background#434340
  • peekViewResult.background#434340
  • peekViewResult.matchHighlightBackground#434340
  • peekViewResult.selectionBackground#434340
  • peekViewTitle.background#434340
  • scrollbarSlider.activeBackground#434340
  • scrollbarSlider.background#434340
  • scrollbarSlider.hoverBackground#434340
  • sideBar.background#434340
  • sideBarSectionHeader.background#434340
  • sideBarTitle.foreground#fffbdd
  • statusBar.background#fed506
  • statusBar.debuggingBackground#2f343f
  • statusBar.foreground#00003C
  • statusBar.noFolderBackground#fed506
  • tab.activeBackground#00003C
  • tab.activeForeground#fffbdd
  • tab.border#001a12
  • tab.inactiveBackground#434340
  • tab.inactiveForeground#fffbdd
  • textLink.activeForeground#e4eef4
  • textLink.foreground#fed506
  • titleBar.activeBackground#21252b
  • titleBar.activeForeground#f3f3f3
  • titleBar.inactiveBackground#21252b
  • titleBar.inactiveForeground#6b717d

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
source.shell#81afc8italic
comment, punctuation.definition.comment#546E7Aitalic
variable, string constant.other.placeholder#fffbdd
constant.other.color#e4eef4
invalid, invalid.illegal##90110f
keyword, storage.type, storage.modifier#e4eef4
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#81afc8
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#c79397
entity.name.function, meta.function-call, variable.function, support.function, keyword.other.special-method#81afc8
meta.block variable.other#fffbdd
support.other.variable, string.other.link#c79397
constant.numeric, constant.language, support.constant, constant.character, constant.escape, variable.parameter, keyword.other.unit, keyword.other#c79397
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#AEE3A6
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#fed506
support.type#B2CCD6
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#B2CCD6
entity.name.module.js, variable.import.parameter.js, variable.other.class.js##90110f
variable.language##90110fitalic
entity.name.method.js#81afc8italic
meta.class-method.js entity.name.function.js, variable.function.constructor#81afc8
entity.other.attribute-name#81afc8
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name#fed506italic
entity.other.attribute-name.class#fed506
source.sass keyword.control#81afc8
markup.inserted#AEE3A6
markup.deleted##90110f
markup.changed#81afc8
string.regexp#81afc8
constant.character.escape#81afc8
*url*, *link*, *uri*underline
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js#81afc8italic
source.js constant.other.object.key.js string.unquoted.label.js##90110fitalic
source.json meta.structure.dictionary.json support.type.property-name.json#81afc8
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#fed506
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#c79397
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##90110f
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#C17E70
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#81afc8
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#c79397
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#81afc8
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#AEE3A6
text.html.markdown, punctuation.definition.list_item.markdown#e4eef4
text.html.markdown markup.inline.raw.markdown#81afc8
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown#65737E
markdown.heading, markup.heading | markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown#AEE3A6
markup.italic#c79397italic
markup.bold, markup.bold string#c79397bold
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#c79397bold
markup.underline#c79397underline
markup.quote punctuation.definition.blockquote.markdown#65737E
markup.quoteitalic
string.other.link.title.markdown#81afc8
string.other.link.description.title.markdown#81afc8
constant.other.reference.link.markdown#fed506
markup.raw.block#81afc8
markup.raw.block.fenced.markdown#00000050
punctuation.definition.fenced.markdown#00000050
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end#e4eef4
variable.language.fenced.markdown#65737E
meta.separator#65737Ebold
markup.table#e4eef4