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#39c7b999
  • debugExceptionWidget.background#00212B
  • debugExceptionWidget.border#AB395B
  • debugToolBar.background#00212B
  • dropdown.background#002B36
  • dropdown.border#39c7b999
  • editor.background#053d48
  • editor.foreground#C8D7D8
  • editor.lineHighlightBackground#184956
  • editor.selectionBackground#274642
  • editor.selectionHighlightBackground#005A6FAA
  • editor.wordHighlightBackground#004454AA
  • editor.wordHighlightStrongBackground#005A6FAA
  • editorCursor.foreground#FD564E
  • editorGhostText.foreground#C8D7D850
  • editorGroup.border#00212B
  • editorGroup.dropBackground#39c7b944
  • editorGroupHeader.tabsBackground#004454
  • editorHoverWidget.background#004454
  • editorIndentGuide.activeBackground1#C8D7D840
  • editorIndentGuide.background1#C8D7D840
  • editorLineNumber.activeForeground#909995
  • editorMarkerNavigationError.background#AB395B
  • editorMarkerNavigationWarning.background#5B7E7A
  • editorStickyScroll.background#00212B
  • editorStickyScrollHover.background#718b9030
  • editorSuggestWidget.border#005A6F
  • editorWhitespace.foreground#C8D7D825
  • editorWidget.background#00212B
  • errorForeground#ffeaea
  • focusBorder#39c7b999
  • input.background#003847
  • input.foreground#C8D7D8
  • input.placeholderForeground#C8D7D8AA
  • inputOption.activeBorder#39c7b999
  • inputValidation.errorBackground#571b26
  • inputValidation.errorBorder#AB395B
  • inputValidation.infoBackground#052730
  • inputValidation.infoBorder#363b5f
  • inputValidation.warningBackground#5d5938
  • inputValidation.warningBorder#9d8a5e
  • list.activeSelectionBackground#005A6F
  • list.dropBackground#00445488
  • list.focusBackground#005A6F
  • list.highlightForeground#39c7b9
  • list.hoverBackground#004454AA
  • list.inactiveSelectionBackground#00445488
  • panel.border#39c7b94A
  • panelTitle.activeBorder#39c7b9
  • peekView.border#CFCEBE2B
  • peekViewEditor.background#00212B
  • peekViewEditor.matchHighlightBackground#004454AA
  • peekViewResult.background#00212B
  • peekViewTitle.background#00212B
  • pickerGroup.border#39c7b999
  • pickerGroup.foreground#39c7b999
  • progressBar.background#047aa6
  • selection.background#39c7b999
  • sideBar.background#00212B
  • sideBar.border#FBF3DB2b
  • sideBarTitle.foreground#C8D7D8
  • statusBar.background#00212B
  • statusBar.border#FBF3DB09
  • statusBar.debuggingBackground#00212B
  • statusBar.foreground#C8D7D8
  • statusBar.noFolderBackground#00212B
  • statusBarItem.prominentBackground#003847
  • statusBarItem.prominentHoverBackground#003847
  • tab.activeBackground#002B36
  • tab.activeBorder#39c7b9
  • tab.activeForeground#C8D7D8
  • tab.border#003847
  • tab.inactiveBackground#004454
  • tab.inactiveForeground#C8D7D8
  • terminal.ansiBlack#FDF6E3
  • terminal.ansiBlue#0096F5
  • terminal.ansiBrightBlack#FBF3DB
  • terminal.ansiBrightBlue#ADBCBC
  • terminal.ansiBrightCyan#0096F5
  • terminal.ansiBrightGreen#80B83C
  • terminal.ansiBrightMagenta#A58CEC
  • terminal.ansiBrightRed#ED8649
  • terminal.ansiBrightWhite#00212B
  • terminal.ansiBrightYellow#e3b230
  • terminal.ansiCyan#39c7b9
  • terminal.ansiGreen#80B83C
  • terminal.ansiMagenta#F275BE
  • terminal.ansiRed#FD564E
  • terminal.ansiWhite#002B36
  • terminal.ansiYellow#e3b230
  • terminal.background#00212B
  • terminal.border#FBF3DB2b
  • terminal.selectionBackground#FBF3DB2b
  • terminalCursor.background#00212B
  • terminalCursor.foreground#ADBCBC
  • titleBar.activeBackground#002B36

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
#C8D7D8
comment, punctuation.definition.comment#ADBCBCaditalic
punctuation.output.jekyll, punctuation.tag.jekyll, punctuation.frontmatter.jekyll, punctuation.output.liquid, punctuation.tag.liquid, punctuation.frontmatter.liquid, punctuation.frontmatter.njk, punctuation.output.njk, punctuation.tag.njk#FDF6E3
entity.name.tag.jekyll, entity.name.tag.liquid, entity.name.tag.njk#F275BEitalic
punctuation.tag.jekyll, punctuation.tag.liquid, punctuation.tag.njk#FDF6E3
variable.other.jekyll, variable.other.liquid, variable.other.njk#FDF6E3
support.function.with-args.jekyll, support.function.with-args.liquid, support.function.with-args.njkitalic
entity.name.type.instance.jsdoc#e3b230
variable, string constant.other.placeholder#ADBCBC
invalid#FFFFFF
invalid.deprecated#FFFFFF
keyword, storage.type, storage.modifier#A58CEC
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#39c7b9
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#ED8649
entity.name.function, variable.function, support.function, keyword.other.special-method, meta.block-level#0096F5
support.other.variable, string.other.link#ED8649
constant.numeric, constant.language, support.constant, constant.character, variable.parameter, keyword.other.unit#ED8649
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#80B83Cnormal
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#e3b230
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#FD564E
variable.language#FD564Eitalic
entity.name.method.js#0096F5
meta.class-method.js entity.name.function.js, variable.function.constructor#0096F5
entity.other.attribute-name#A58CEC
markup.inserted#80B83C
markup.deleted#FD564E
markup.changed#A58CEC
string.regexp#39c7b9
constant.character.escape#FD564E
*url*, *link*, *uri*underline
constant.numeric.line-number.find-in-files - match#A58CEC
entity.name.filename.find-in-files#80B83C
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js#0096F5italic
source.js constant.other.object.key.js string.unquoted.label.js#FD564Eitalic
source.json meta meta meta meta meta meta meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json string.quoted.double.json - meta meta meta meta meta meta meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json string.quoted.double.json, source.json meta meta meta meta meta meta meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json punctuation.definition.string - meta meta meta meta meta meta meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json punctuation.definition.string#FD564Ebf
source.json meta meta meta meta meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json string.quoted.double.json - meta meta meta meta meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json string.quoted.double.json, source.json meta meta meta meta meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json punctuation.definition.string - meta meta meta meta meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json punctuation.definition.string#0096F5bf
source.json meta meta meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json string.quoted.double.json - meta meta meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json string.quoted.double.json, source.json meta meta meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json punctuation.definition.string - meta meta meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json punctuation.definition.string#e3b230bf
source.json meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json string.quoted.double.json - meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json string.quoted.double.json, source.json meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json punctuation.definition.string - meta meta meta meta meta meta meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json punctuation.definition.string#A58CECbf
source.json meta meta meta meta meta meta meta meta.structure.dictionary.json string.quoted.double.json - meta meta meta meta meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json string.quoted.double.json, source.json meta meta meta meta meta meta meta meta.structure.dictionary.json punctuation.definition.string - meta meta meta meta meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json punctuation.definition.string#ED8649
source.json meta meta meta meta meta meta.structure.dictionary.json string.quoted.double.json - meta meta meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json string.quoted.double.json, source.json meta meta meta meta meta meta.structure.dictionary.json punctuation.definition.string - meta meta meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json punctuation.definition.string#FD564E
source.json meta meta meta meta.structure.dictionary.json string.quoted.double.json - meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json string.quoted.double.json, source.json meta meta meta meta.structure.dictionary.json punctuation.definition.string - meta meta meta meta.structure.dictionary.json meta.structure.dictionary.value.json punctuation.definition.string#0096F5
source.json meta meta.structure.dictionary.json string.quoted.double.json - meta meta.structure.dictionary.json meta.structure.dictionary.value.json string.quoted.double.json, source.json meta meta.structure.dictionary.json punctuation.definition.string - meta meta.structure.dictionary.json meta.structure.dictionary.value.json punctuation.definition.string#e3b230
source.json meta.structure.dictionary.json string.quoted.double.json - meta.structure.dictionary.json meta.structure.dictionary.value.json string.quoted.double.json, source.json meta.structure.dictionary.json punctuation.definition.string - meta.structure.dictionary.json meta.structure.dictionary.value.json punctuation.definition.string#A58CEC
text.html.markdown, punctuation.definition.list_item.markdown#ADBCBC
punctuation.definition.list.begin.markdown#0096F5
text.html.markdown markup.raw.inline#ADBCBCcc
text.html.markdown meta.dummy.line-break#FFFFFF50
markdown.heading, markup.heading | markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown#ED8649
markup.italic, markup.italic stringitalic
markup.bold, markup.bold stringbold
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 stringbold italic
markup.underline#80B83Cunderline
markup.strike#ADBCBCstrike
markup.quote punctuation.definition.blockquote.markdown#FFFFFF16
markup.quote#ADBCBCitalic
string.other.link.title.markdown#0096F5
string.other.link.description.title.markdown#A58CEC
constant.other.reference.link.markdown#e3b230
markup.raw.block#ADBCBCcc
markup.raw.block.fenced.markdown
punctuation.definition.fenced.markdown
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end#ADBCBC
punctuation.definition.fenced.markdown, meta.definition.language.raw.block.fenced.markdown#FFFFFF50
variable.language.fenced.markdown#ADBCBC
meta.separator#ADBCBCbold
markup.table#ADBCBCcc
text.html.markdown punctuation.definition, 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#39c7b9
punctuation.definition.list_item.todo.done#80B83C
punctuation.definition.list_item.todo.cancelled#FD564E
markup.checkbox.markdown markup.checkbox.checked_symbol.markdown#80B83C
markup.admonition.markdown string.other.admonition.title.markdown#ADBCBCbold
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#A58CEC75
markup.admonition.markdown entity.name.admonition.markdown#A58CECbold
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#A58CEC35
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#0096F575
markup.admonition.markdown.hint entity.name.admonition.markdown#0096F5bold
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#0096F535
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#e3b23075
markup.admonition.markdown.warning entity.name.admonition.markdown#e3b230bold
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#e3b23035
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#FD564E75
markup.admonition.markdown.danger entity.name.admonition.markdown#FD564Ebold
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#FD564E35
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#80B83C75
markup.admonition.markdown.attention entity.name.admonition.markdown#80B83Cbold
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#80B83C35
acejump.label#FFFFFF
sublimelinter.mark.warning#e3b230
sublimelinter.gutter-mark#FFFFFF
sublimelinter.mark.error#FD564E
markup.ignored.git_gutter#ADBCBC
markup.untracked.git_gutter#ADBCBC
markup.inserted.git_gutter#80B83C
markup.changed.git_gutter#e3b230
markup.deleted.git_gutter#FD564E
brackethighlighter.default#A58CEC
brackethighlighter.unmatched#FD564E
brackethighlighter.curly#A58CEC
brackethighlighter.round#e3b230
brackethighlighter.square#0096F5
brackethighlighter.angle#ED8649
brackethighlighter.tag#39c7b9
brackethighlighter.quote#80B83C

Shiki preview

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

Loading...

Better Solarized - Coding Theme