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. A key in the color catalog links to its detail page.

keyHEXRGBRGBA
activeLinkForeground
background
caret
currentFindMatchHighlight
editor.background
editor.foreground
editor.selectionBackground
findMatchHighlight
findRangeHighlight
foreground
gotoDefinitionLinkForeground
guide
hoverHighlight
inactiveSelection
input.background
input.border
input.foreground
invisibles
lineHighlight
panel.background
rangeHighlight
referenceHighlight
selection
selectionHighlight
sideBar.background
statusBar.background
statusBar.border
statusBar.debuggingBackground
statusBar.debuggingForeground
statusBar.foreground
statusBar.noFolderBackground
statusBarItem.activeBackground
statusBarItem.hoverBackground
statusBarItem.prominentBackground
statusBarItem.prominentHoverBackground
wordHighlight
wordHighlightStrong

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment#5C6370—
string#C8AE9D—
constant.numeric#D19A66—
constant.language#56B6C2—
constant.character, constant.other#56B6C2—
variable#ff9057
keyword#DD672C—
storage#DD672C
storage.type#DD672C—
entity.name.class#E5C07B—
entity.other.inherited-class#C8AE9Ditalic underline
entity.name.function#EBEBFF
variable.parameter#f0a27aitalic
entity.name.tag#E06C75
entity.other.attribute-name#D19A66
support.function#56B6C2
support.constant#D19A66
support.type, support.class#E5C07Bitalic
support.other.variable#ABB2BF—
invalid#FFFFFF
invalid.deprecated#F8F8F0—
markup.quote#D19A66—
markup.bold#D19A66bold
markup.italic#D19A66italic
markup.inline.raw#C8AE9D—
markup.heading.setext#E06C75—