Skip to main content
CodingTheme

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.

  • editor.background#282c34
  • editor.foreground#abb2bf
  • editor.lineHighlightBackground#54586255
  • editor.selectionBackground#3e4451
  • editorCursor.foreground#abb2bf
  • editorWhitespace.foreground#545862

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
#abb2bf
variable.parameter.function#abb2bf
comment, punctuation.definition.comment#545862
punctuation.definition.string, punctuation.definition.variable, punctuation.definition.string, punctuation.definition.parameters, punctuation.definition.string, punctuation.definition.array#abb2bf
none#abb2bf
keyword.operator#abb2bf
keyword#c678dd
variable#e06c75
entity.name.function, meta.require, support.function.any-method#61afef
support.class, entity.name.class, entity.name.type.class#e5c07b
meta.class#c8ccd4
keyword.other.special-method#61afef
storage#c678dd
support.function#56b6c2
string, constant.other.symbol, entity.other.inherited-class#98c379
constant.numeric#d19a66
none#d19a66
none#d19a66
constant#d19a66
entity.name.tag#e06c75
entity.other.attribute-name#d19a66
entity.other.attribute-name.id, punctuation.definition.entity#61afef
meta.selector#c678dd
none#d19a66
markup.heading punctuation.definition.heading, entity.name.section#61afef
keyword.other.unit#d19a66
markup.bold, punctuation.definition.bold#e5c07bbold
markup.italic, punctuation.definition.italic#c678dditalic
markup.raw.inline#98c379
string.other.link, punctuation.definition.string.end.markdown#e06c75
meta.link#d19a66
markup.list#e06c75
markup.quote#d19a66
meta.separator#abb2bf
markup.inserted#98c379
markup.deleted#e06c75
markup.changed#c678dd
constant.other.color#56b6c2
string.regexp#56b6c2
constant.character.escape#56b6c2
punctuation.section.embedded, variable.interpolation#c678dd
invalid.illegal#c8ccd4
invalid.broken#282c34
invalid.deprecated#c8ccd4
invalid.unimplemented#c8ccd4

Shiki preview

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

Loading...