Skip to main content
CodingTheme

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.lineHighlightBackground#073642
  • editor.selectionBackground#274642
  • editor.selectionHighlightBackground#005A6FAA
  • editor.wordHighlightBackground#004454AA
  • editor.wordHighlightStrongBackground#005A6FAA
  • editorCursor.foreground#D30102
  • editorGroup.border#00212B
  • editorGroup.dropBackground#2AA19844
  • editorGroupHeader.tabsBackground#004052
  • editorHoverWidget.background#004052
  • editorIndentGuide.activeBackground#93A1A140
  • editorIndentGuide.background#93A1A140
  • editorLineNumber.activeForeground#949494
  • editorMarkerNavigationError.background#AB395B
  • editorMarkerNavigationWarning.background#5B7E7A
  • 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#EEE8D52B
  • peekViewEditor.background#00212B
  • peekViewEditor.matchHighlightBackground#004454AA
  • peekViewResult.background#00212B
  • peekViewTitle.background#00212B
  • pickerGroup.border#2AA19899
  • pickerGroup.foreground#2AA19899
  • 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
  • tab.activeBackground#002B37
  • tab.activeBorder#2AA198
  • tab.activeForeground#d6dbdb
  • tab.border#003847
  • tab.inactiveBackground#004052
  • tab.inactiveForeground#93A1A1
  • terminal.ansiBlack#00212B
  • terminal.ansiBlue#268BD2
  • terminal.ansiBrightBlack#073642
  • 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.jekyllitalic
entity.name.type.instance.jsdoc#B58900
variable, string constant.other.placeholder#839496
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#2AA198
*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 stringitalic
markup.bold, markup.bold stringbold 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 stringitalic
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
acejump.label#FFFFFF
sublimelinter.mark.warning#B58900
sublimelinter.gutter-mark#FFFFFF
sublimelinter.mark.error#DC322F
markup.ignored.git_gutter#586E75
markup.untracked.git_gutter#586E75
markup.inserted.git_gutter#859900
markup.changed.git_gutter#B58900
markup.deleted.git_gutter#DC322F
brackethighlighter.default#6C71C4
brackethighlighter.unmatched#DC322F
brackethighlighter.curly#644ea0
brackethighlighter.round#B58900
brackethighlighter.square#268BD2
brackethighlighter.angle#CB4B16
brackethighlighter.tag#2AA198
brackethighlighter.quote#859900

Shiki preview

TypeScript sample highlighted with this variant's colors and tokenColors.

Loading...

Better Solarized Dark (No Italics) by Zane Hitchcox - VS Code Theme