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#171717
  • activityBar.foreground#D4D4D4
  • activityBarBadge.background#ffbe85
  • activityBarBadge.foreground#000
  • badge.background#ffbe85
  • badge.foreground#000
  • button.background#ffbe85
  • button.foreground#000
  • button.hoverBackground#ffd9b3
  • diffEditor.insertedLineBackground#f585ed15
  • diffEditor.insertedTextBackground#f585ed15
  • diffEditor.removedLineBackground#ff858515
  • diffEditor.removedTextBackground#ff858515
  • editor.background#171717
  • editor.foreground#FAFAFA
  • editor.selectionBackground#FFFFFF25
  • editor.selectionHighlightBackground#FFFFFF25
  • editorBracketHighlight.foreground1#D4D4D4
  • editorBracketHighlight.foreground2#D4D4D4
  • editorBracketHighlight.foreground3#D4D4D4
  • editorBracketHighlight.foreground4#D4D4D4
  • editorBracketHighlight.foreground5#D4D4D4
  • editorBracketHighlight.foreground6#D4D4D4
  • editorBracketHighlight.unexpectedBracket.foreground#ff8585
  • editorError.foreground#ff8585
  • editorGroupHeader.tabsBackground#171717
  • editorGutter.addedBackground#f585ed
  • editorGutter.deletedBackground#ff8585
  • editorGutter.modifiedBackground#ffbe85
  • editorHoverWidget.background#262626
  • editorHoverWidget.border#404040
  • editorInlayHint.background#262626
  • editorInlayHint.foreground#D4D4D4
  • editorLineNumber.foreground#737373
  • editorOverviewRuler.border#171717
  • editorWarning.foreground#ffbe85
  • editorWidget.background#171717
  • focusBorder#ffbe85
  • icon.foreground#D4D4D4
  • input.background#262626
  • list.activeSelectionBackground#404040
  • list.activeSelectionForeground#ffbe85
  • list.errorForeground#ff8585
  • list.highlightForeground#ffbe85
  • list.hoverBackground#404040
  • list.inactiveSelectionBackground#404040
  • menu.background#171717
  • menu.border#404040
  • scrollbarSlider.background#52525280
  • scrollbarSlider.hoverBackground#525252
  • selection.background#A1A1A1
  • settings.modifiedItemIndicator#ffbe85
  • sideBar.background#171717
  • sideBarSectionHeader.background#171717
  • sideBarSectionHeader.foreground#D4D4D4
  • sideBarTitle.foreground#D4D4D4
  • statusBar.background#171717
  • statusBar.debuggingBackground#ffbe85
  • statusBar.debuggingForeground#FAFAFA
  • statusBar.foreground#D4D4D4
  • statusBarItem.remoteBackground#ffbe85
  • statusBarItem.remoteForeground#000
  • tab.activeBackground#262626
  • tab.border#171717
  • tab.inactiveBackground#171717
  • terminal.ansiBlack#262626
  • terminal.ansiBlue#85adff
  • terminal.ansiBrightBlack#A1A1A1
  • terminal.ansiBrightBlue#85adff
  • terminal.ansiBrightCyan#85ffff
  • terminal.ansiBrightGreen#85ffad
  • terminal.ansiBrightMagenta#f585ed
  • terminal.ansiBrightRed#ff8585
  • terminal.ansiBrightWhite#FAFAFA
  • terminal.ansiBrightYellow#ffd9b3
  • terminal.ansiCyan#85ffff
  • terminal.ansiGreen#85ffad
  • terminal.ansiMagenta#ad85ff
  • terminal.ansiRed#ff8585
  • terminal.ansiWhite#D4D4D4
  • terminal.ansiYellow#ffbe85
  • terminal.background#171717
  • terminal.foreground#FAFAFA
  • textLink.activeForeground#ffd9b3
  • textLink.foreground#ffbe85
  • titleBar.activeBackground#171717
  • titleBar.activeForeground#A1A1A1
  • titleBar.inactiveBackground#171717
  • titleBar.inactiveForeground#A1A1A1

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#A1A1A194
variable, string constant.other.placeholder, entity.name.tag#ff8585
constant.other.color#ffbe85
invalid, invalid.illegal#ff8585
keyword, storage.type, storage.modifier#85adff
keyword.control, constant.other.color, 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#D4D4D4
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#ffbe85
entity.name.function, variable.function, support.function, keyword.other.special-method#ffbe85
meta.block variable.other#ff8585
support.other.variable, string.other.link#ff8585
constant.numeric, support.constant, constant.character, constant.escape, keyword.other.unit, keyword.other, constant.language.boolean#85ffff
string, constant.other.symbol, constant.other.key, meta.group.braces.curly constant.other.object.key.js string.unquoted.label.js#85ffad
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#ffbe85
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, source.postcss support.type.property-name, support.type.vendored.property-name.css, source.css.scss entity.name.tag, variable.parameter.keyframe-list.css, meta.property-name.css, variable.parameter.url.scss, meta.property-value.scss, meta.property-value.css#ff8585
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#ffbe85
variable.language#ffbe85
entity.name.method.js#ffbe85
meta.class-method.js entity.name.function.js, variable.function.constructor#ffbe85
entity.other.attribute-name, meta.property-list.scss, meta.attribute-selector.scss, meta.property-value.css, entity.other.keyframe-offset.css, meta.selector.css, entity.name.tag.reference.scss, entity.name.tag.nesting.css, punctuation.separator.key-value.css#ff8585
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name#ff8585
entity.other.attribute-name.class, entity.other.attribute-name.id, meta.attribute-selector.scss, variable.parameter.misc.css#ff8585
source.sass keyword.control, meta.attribute-selector.scss#ff8585
markup.inserted#85ffad
markup.deleted#ff8585
markup.changed#ffbe85
string.regexp#85ffad
constant.character.escape#85ffff
*url*, *link*, *uri*underline
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js#ffbe85
source.js constant.other.object.key.js string.unquoted.label.js#ff8585italic
source.json meta.structure.dictionary.json support.type.property-name.json#ff8585
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#ff8585
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#ff8585
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#ff8585
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#ff8585
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#ff8585
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#ff8585
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#ff8585
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#ff8585
text.html.markdown, punctuation.definition.list_item.markdown#D4D4D4
text.html.markdown markup.inline.raw.markdown#85ffad
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown#D4D4D4
markdown.heading, markup.heading | markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown, markup.heading, markup.inserted.git_gutter#ffbe85
markup.italic#D4D4D4italic
markup.bold, markup.bold string#D4D4D4bold
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#D4D4D4bold
markup.underline#ffbe85underline
markup.quote punctuation.definition.blockquote.markdown#D4D4D4
markup.quote
string.other.link.title.markdown#85ffad
string.other.link.description.title.markdown#D4D4D4
constant.other.reference.link.markdown#ffbe85
markup.raw.block#85ffad
markup.raw.block.fenced.markdown#85ffad
punctuation.definition.fenced.markdown#D4D4D4
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end#85ffad
variable.language.fenced.markdown#85ffad
meta.separator#D4D4D4bold
markup.table#D4D4D4