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#003847
  • activityBarBadge.background#AB395B
  • badge.background#047aa6
  • button.background#2AA19899
  • debugExceptionWidget.background#00212B
  • debugExceptionWidget.border#AB395B
  • debugToolBar.background#00212B
  • dropdown.background#00212B
  • dropdown.border#2AA19899
  • editor.background#002B36
  • editor.foreground#839496
  • editor.lineHighlightBackground#073642
  • editor.selectionBackground#274642
  • editor.selectionHighlightBackground#005A6FAA
  • editor.wordHighlightBackground#004454AA
  • editor.wordHighlightStrongBackground#005A6FAA
  • editorCursor.foreground#D30102
  • editorGhostText.foreground#93A1A150
  • editorGroup.border#00212B
  • editorGroup.dropBackground#2AA19844
  • editorGroupHeader.tabsBackground#004052
  • editorHoverWidget.background#004052
  • editorIndentGuide.activeBackground1#C3E1E180
  • editorIndentGuide.background1#93A1A140
  • editorLineNumber.activeForeground#949494
  • editorMarkerNavigationError.background#AB395B
  • editorMarkerNavigationWarning.background#5B7E7A
  • editorStickyScroll.background#00212B
  • editorStickyScrollHover.background#586E7530
  • editorWhitespace.foreground#93A1A125
  • editorWidget.background#00212B
  • errorForeground#ffeaea
  • focusBorder#2AA19899
  • input.background#003847
  • input.foreground#93A1A1
  • input.placeholderForeground#93A1A1AA
  • inputOption.activeBorder#2AA19899
  • inputValidation.errorBackground#571b26
  • inputValidation.errorBorder#a92049
  • inputValidation.infoBackground#052730
  • inputValidation.infoBorder#363b5f
  • inputValidation.warningBackground#5d5938
  • inputValidation.warningBorder#9d8a5e
  • list.activeSelectionBackground#005A6F
  • list.dropBackground#00445488
  • list.focusBackground#005A6F
  • list.highlightForeground#1ebcc5
  • list.hoverBackground#004454AA
  • list.inactiveSelectionBackground#00445488
  • panel.border#2AA1984A
  • panelTitle.activeBorder#2AA198
  • peekView.border#2b2b4a
  • peekViewEditor.background#00212B
  • peekViewEditor.matchHighlightBackground#00445440
  • peekViewResult.background#00212B
  • peekViewTitle.background#00212B
  • pickerGroup.border#2AA19899
  • pickerGroup.foreground#2AA19899
  • ports.iconRunningProcessForeground#369432
  • progressBar.background#047aa6
  • selection.background#2AA19899
  • sideBar.background#00212B
  • sideBar.border#EEE8D52B
  • sideBarTitle.foreground#93A1A1
  • statusBar.background#00212B
  • statusBar.border#EEE8D509
  • statusBar.debuggingBackground#00212B
  • statusBar.foreground#93A1A1
  • statusBar.noFolderBackground#00212B
  • statusBarItem.prominentBackground#003847
  • statusBarItem.prominentHoverBackground#003847
  • statusBarItem.remoteBackground#2AA19899
  • tab.activeBackground#002B37
  • tab.activeBorder#2AA198
  • tab.activeForeground#d6dbdb
  • tab.border#003847
  • tab.inactiveBackground#004052
  • tab.inactiveForeground#93A1A1
  • terminal.ansiBlack#073642
  • terminal.ansiBlue#268BD2
  • terminal.ansiBrightBlack#00212B
  • terminal.ansiBrightBlue#839496
  • terminal.ansiBrightCyan#268BD2
  • terminal.ansiBrightGreen#859900
  • terminal.ansiBrightMagenta#6C71C4
  • terminal.ansiBrightRed#CB4B16
  • terminal.ansiBrightWhite#FDF6E3
  • terminal.ansiBrightYellow#B58900
  • terminal.ansiCyan#2AA198
  • terminal.ansiGreen#859900
  • terminal.ansiMagenta#D33682
  • terminal.ansiRed#DC322F
  • terminal.ansiWhite#EEE8D5
  • terminal.ansiYellow#B58900
  • terminal.background#00212B
  • terminal.border#EEE8D52B
  • terminal.selectionBackground#EEE8D52B
  • terminalCursor.background#00212B
  • terminalCursor.foreground#839496
  • titleBar.activeBackground#002C39

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
—#839496—
comment, punctuation.definition.comment#586E75italic
punctuation.output.jekyll, punctuation.tag.jekyll, punctuation.frontmatter.jekyll, punctuation.output.liquid, punctuation.tag.liquid#bbbbbb—
entity.name.tag.jekyll, entity.name.tag.liquid#D33682italic
punctuation.tag.jekyll, punctuation.tag.liquid#BBBBBB—
variable.other.jekyll, variable.other.liquid#BBBBBB—
support.function.with-args.jekyll—italic
entity.name.type.instance.jsdoc#B58900—
variable, string constant.other.placeholder#839496italic
invalid#FFFFFF—
invalid.deprecated#FFFFFF—
keyword, storage.type, storage.modifier#6C71C4—
keyword.control, keyword.operator.new, keyword.operator.module, variable.language.super#6C71C4italic
keyword, storage.modifier,source.css meta.selector.css entity.other.attribute-name.pseudo-element.css#6C71C4italic
keyword.operator, 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#2AA198—
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#cf4b56—
entity.name.function, variable.function, support.function, keyword.other.special-method, meta.block-level#268BD2—
support.other.variable, string.other.link#cf4b56—
constant.numeric, constant.language, support.constant, constant.character, variable.parameter, keyword.other.unit#CB4B16—
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#859900normal
entity.name.class, entity.name.type.class, support.type, support.class, support.other.namespace.use.php, meta.use.php, support.other.namespace.php, markup.changed.git_gutter, keyword.other.unit.px.css#B58900—
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#DC322F—
variable.language#DC322Fitalic
entity.name.method.js#268BD2—
meta.class-method.js entity.name.function.js, variable.function.constructor#268BD2—
entity.other.attribute-name#6C71C4—
constant.numeric #D33682—
markup.inserted#859900—
markup.deleted#DC322F—
markup.changed#6C71C4—
string.regexp#2AA198—
constant.character.escape#CB4B16—
*url*, *link*, *uri*—underline
constant.numeric.line-number.find-in-files - match#7f2a1d—
entity.name.filename.find-in-files#859900—
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js#268BD2italic
source.js constant.other.object.key.js string.unquoted.label.js#DC322Fitalic
meta.structure.dictionary.json string.quoted.double.json#2AA198—
meta.structure.dictionary.json string.quoted.double.detected-link#6C71C4bf—
source.json meta.structure.dictionary.json support.type.property-name.json#859900—
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#B58900—
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#268BD2italic
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#DC322F—
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#CB4B16italic
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#E06C75—
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#6C71C4bfitalic
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#B58900bf—
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#268BD2bfitalic
punctuation.definition.block.sequence.item.yaml#6C71C4—
text.html.markdown, punctuation.definition.list_item.markdown#839496—
punctuation.definition.list.begin.markdown#268BD2—
text.html.markdown markup.raw.inline#839496cc—
markup.inline.raw, text.html.markdown punctuation.definition#B58900—
text.html.markdown meta.dummy.line-break#FFFFFF50—
markdown.heading, markup.heading | markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown#cf4b56—
markup.italic, markup.italic string—italic
markup.bold, markup.bold string—bold italic
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—italic
markup.underline#859900underline
markup.strike#586E75strike
markup.quote punctuation.definition.blockquote.markdown#FFFFFF16
markup.quote#586E75italic
string.other.link.title.markdown#268BD2—
string.other.link.description.title.markdown#6C71C4—
constant.other.reference.link.markdown#B58900—
markup.raw.block#839496cc—
markup.raw.block.fenced.markdown——
punctuation.definition.fenced.markdown——
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end#839496—
punctuation.definition.fenced.markdown, meta.definition.language.raw.block.fenced.markdown#FFFFFF50
variable.language.fenced.markdown#586E75
meta.separator#586E75bold
markup.table#839496cc—
text.html.markdown.note punctuation.definition.list_item.markdown, markup.table.markdown punctuation.definition.table.vertical-line.markdown, text.html.markdown markup.checkbox.markdown#FFFFFF50
text.html.markdown meta.disable-markdown punctuation.definition#2AA198—
punctuation.definition.list_item.todo.done#859900—
punctuation.definition.list_item.todo.cancelled#DC322F—
markup.checkbox.markdown markup.checkbox.checked_symbol.markdown#859900—
markup.admonition.markdown string.other.admonition.title.markdown#839496bold
markup.admonition.markdown markup.admonition.header.markdown——
markup.admonition.markdown markup.admonition.body.markdown——
markup.admonition.markdown punctuation.definition.admonition.markdown, markup.admonition.markdown punctuation.definition.heading, markup.admonition.markdown punctuation.definition.table.vertical-line, markup.admonition.markdown punctuation.definition.table.horizontal-line, markup.admonition.markdown punctuation.definition.table.alignments, markup.admonition.markdown punctuation.definition.heading, markup.admonition.markdown punctuation.definition.bold, markup.admonition.markdown punctuation.definition.italic, markup.admonition.markdown punctuation.definition.list_item, markup.admonition.markdown punctuation.definition.raw, markup.admonition.markdown markup.checkbox.markdown, markup.admonition.markdown punctuation.definition.list_item.todo.pending, markup.admonition.markdown meta.link punctuation.definition, markup.admonition.markdown meta.link.inline markup.underline.link, markup.admonition.markdown meta.link.reference.markdown constant.other.reference.link.markdown, markup.admonition.markdown punctuation.definition.entity.html, markup.admonition.markdown meta.separator.markdown, markup.admonition.markdown markup.table.markdown punctuation.definition.table.vertical-line.markdown, markup.admonition.markdown meta.definition.language.raw.block.fenced.markdown#644ea075—
markup.admonition.markdown entity.name.admonition.markdown#644ea0bold
markup.admonition.markdown markup.table, markup.admonition.markdown markup.raw, markup.admonition.markdown markup.raw.block.fenced meta.language, markup.admonition.markdown punctuation.definition.blockquote.markdown, markup.admonition.markdown meta.separator, markup.admonition.markdown markup.raw.inline, markup.admonition.markdown markup.raw.block——
markup.admonition.markdown markup.quote punctuation.definition.blockquote.markdown#644ea035—
markup.admonition.markdown.hint markup.admonition.header.markdown——
markup.admonition.markdown.hint markup.admonition.body.markdown——
markup.admonition.markdown.hint punctuation.definition.admonition.markdown, markup.admonition.markdown.hint punctuation.definition.heading, markup.admonition.markdown.hint punctuation.definition.table.vertical-line, markup.admonition.markdown.hint punctuation.definition.table.horizontal-line, markup.admonition.markdown.hint punctuation.definition.table.alignments, markup.admonition.markdown.hint punctuation.definition.heading, markup.admonition.markdown.hint punctuation.definition.bold, markup.admonition.markdown.hint punctuation.definition.italic, markup.admonition.markdown.hint punctuation.definition.list_item, markup.admonition.markdown.hint punctuation.definition.raw, markup.admonition.markdown.hint markup.checkbox.markdown, markup.admonition.markdown.hint punctuation.definition.list_item.todo.pending, markup.admonition.markdown.hint meta.link punctuation.definition, markup.admonition.markdown.hint meta.link.inline markup.underline.link, markup.admonition.markdown.hint meta.link.reference.markdown constant.other.reference.link.markdown, markup.admonition.markdown.hint punctuation.definition.entity.html, markup.admonition.markdown.hint meta.separator.markdown, markup.admonition.markdown.hint markup.table.markdown punctuation.definition.table.vertical-line.markdown, markup.admonition.markdown.hint meta.definition.language.raw.block.fenced.markdown#268BD275—
markup.admonition.markdown.hint entity.name.admonition.markdown#268BD2bold
markup.admonition.markdown.hint markup.table, markup.admonition.markdown.hint markup.raw, markup.admonition.markdown.hint markup.raw.block.fenced meta.language, markup.admonition.markdown.hint punctuation.definition.blockquote.markdown, markup.admonition.markdown.hint meta.separator, markup.admonition.markdown.hint markup.raw.inline, markup.admonition.markdown.hint markup.raw.block——
markup.admonition.markdown.hint markup.quote punctuation.definition.blockquote.markdown#268BD235—
markup.admonition.markdown.warning markup.admonition.header.markdown——
markup.admonition.markdown.warning markup.admonition.body.markdown——
markup.admonition.markdown.warning punctuation.definition.admonition.markdown, markup.admonition.markdown.warning punctuation.definition.heading, markup.admonition.markdown.warning punctuation.definition.table.vertical-line, markup.admonition.markdown.warning punctuation.definition.table.horizontal-line, markup.admonition.markdown.warning punctuation.definition.table.alignments, markup.admonition.markdown.warning punctuation.definition.heading, markup.admonition.markdown.warning punctuation.definition.bold, markup.admonition.markdown.warning punctuation.definition.italic, markup.admonition.markdown.warning punctuation.definition.list_item, markup.admonition.markdown.warning punctuation.definition.raw, markup.admonition.markdown.warning markup.checkbox.markdown, markup.admonition.markdown.warning punctuation.definition.list_item.todo.pending, markup.admonition.markdown.warning meta.link punctuation.definition, markup.admonition.markdown.warning meta.link.inline markup.underline.link, markup.admonition.markdown.warning meta.link.reference.markdown constant.other.reference.link.markdown, markup.admonition.markdown.warning punctuation.definition.entity.html, markup.admonition.markdown.warning meta.separator.markdown, markup.admonition.markdown.warning markup.table.markdown punctuation.definition.table.vertical-line.markdown, markup.admonition.markdown.warning meta.definition.language.raw.block.fenced.markdown#B5890075—
markup.admonition.markdown.warning entity.name.admonition.markdown#B58900bold
markup.admonition.markdown.warning markup.table, markup.admonition.markdown.warning markup.raw, markup.admonition.markdown.warning markup.raw.block.fenced meta.language, markup.admonition.markdown.warning punctuation.definition.blockquote.markdown, markup.admonition.markdown.warning meta.separator, markup.admonition.markdown.warning markup.raw.inline, markup.admonition.markdown.warning markup.raw.block——
markup.admonition.markdown.warning markup.quote punctuation.definition.blockquote.markdown#B5890035—
markup.admonition.markdown.danger markup.admonition.header.markdown——
markup.admonition.markdown.danger markup.admonition.body.markdown——
markup.admonition.markdown.danger punctuation.definition.admonition.markdown, markup.admonition.markdown.danger punctuation.definition.heading, markup.admonition.markdown.danger punctuation.definition.table.vertical-line, markup.admonition.markdown.danger punctuation.definition.table.horizontal-line, markup.admonition.markdown.danger punctuation.definition.table.alignments, markup.admonition.markdown.danger punctuation.definition.heading, markup.admonition.markdown.danger punctuation.definition.bold, markup.admonition.markdown.danger punctuation.definition.italic, markup.admonition.markdown.danger punctuation.definition.list_item, markup.admonition.markdown.danger punctuation.definition.raw, markup.admonition.markdown.danger markup.checkbox.markdown, markup.admonition.markdown.danger punctuation.definition.list_item.todo.pending, markup.admonition.markdown.danger meta.link punctuation.definition, markup.admonition.markdown.danger meta.link.inline markup.underline.link, markup.admonition.markdown.danger meta.link.reference.markdown constant.other.reference.link.markdown, markup.admonition.markdown.danger punctuation.definition.entity.html, markup.admonition.markdown.danger meta.separator.markdown, markup.admonition.markdown.danger markup.table.markdown punctuation.definition.table.vertical-line.markdown, markup.admonition.markdown.danger meta.definition.language.raw.block.fenced.markdown#DC322F75—
markup.admonition.markdown.danger entity.name.admonition.markdown#DC322Fbold
markup.admonition.markdown.danger markup.table, markup.admonition.markdown.danger markup.raw, markup.admonition.markdown.danger markup.raw.block.fenced meta.language, markup.admonition.markdown.danger punctuation.definition.blockquote.markdown, markup.admonition.markdown.danger meta.separator, markup.admonition.markdown.danger markup.raw.inline, markup.admonition.markdown.danger markup.raw.block——
markup.admonition.markdown.danger markup.quote punctuation.definition.blockquote.markdown#DC322F35—
markup.admonition.markdown.attention markup.admonition.header.markdown——
markup.admonition.markdown.attention markup.admonition.body.markdown——
markup.admonition.markdown.attention punctuation.definition.admonition.markdown, markup.admonition.markdown.attention punctuation.definition.heading, markup.admonition.markdown.attention punctuation.definition.table.vertical-line, markup.admonition.markdown.attention punctuation.definition.table.horizontal-line, markup.admonition.markdown.attention punctuation.definition.table.alignments, markup.admonition.markdown.attention punctuation.definition.heading, markup.admonition.markdown.attention punctuation.definition.bold, markup.admonition.markdown.attention punctuation.definition.italic, markup.admonition.markdown.attention punctuation.definition.list_item, markup.admonition.markdown.attention punctuation.definition.raw, markup.admonition.markdown.attention markup.checkbox.markdown, markup.admonition.markdown.attention punctuation.definition.list_item.todo.pending, markup.admonition.markdown.attention meta.link punctuation.definition, markup.admonition.markdown.attention meta.link.inline markup.underline.link, markup.admonition.markdown.attention meta.link.reference.markdown constant.other.reference.link.markdown, markup.admonition.markdown.attention punctuation.definition.entity.html, markup.admonition.markdown.attention meta.separator.markdown, markup.admonition.markdown.attention markup.table.markdown punctuation.definition.table.vertical-line.markdown, markup.admonition.markdown.attention meta.definition.language.raw.block.fenced.markdown#85990075—
markup.admonition.markdown.attention entity.name.admonition.markdown#859900bold
markup.admonition.markdown.attention markup.table, markup.admonition.markdown.attention markup.raw, markup.admonition.markdown.attention markup.raw.block.fenced meta.language, markup.admonition.markdown.attention punctuation.definition.blockquote.markdown, markup.admonition.markdown.attention meta.separator, markup.admonition.markdown.attention markup.raw.inline, markup.admonition.markdown.attention markup.raw.block——
markup.admonition.markdown.attention markup.quote punctuation.definition.blockquote.markdown#85990035—
Darkerized Better Solarized by joelsantos - VS Code Theme