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
activityBar.background
activityBar.foreground
button.background
button.foreground
debugToolBar.background
dropdown.background
dropdown.foreground
editor.background
editor.foreground
editor.inactiveSelectionBackground
editor.lineHighlightBackground
editor.selectionBackground
editorCursor.foreground
editorLineNumber.foreground
foreground
gitDecoration.conflictingResourceForeground
gitDecoration.deletedResourceForeground
gitDecoration.ignoredResourceForeground
gitDecoration.modifiedResourceForeground
gitDecoration.untrackedResourceForeground
input.background
input.foreground
list.activeSelectionBackground
list.activeSelectionForeground
list.inactiveSelectionBackground
list.inactiveSelectionForeground
panel.background
panel.border
panelTitle.activeForeground
panelTitle.inactiveForeground
sideBar.background
sideBar.foreground
statusBar.background
statusBar.foreground
tab.activeBackground
tab.activeForeground
tab.inactiveBackground
tab.inactiveForeground
terminal.ansiBlack
terminal.ansiBlue
terminal.ansiBrightBlack
terminal.ansiBrightBlue
terminal.ansiBrightCyan
terminal.ansiBrightGreen
terminal.ansiBrightMagenta
terminal.ansiBrightRed
terminal.ansiBrightWhite
terminal.ansiBrightYellow
terminal.ansiCyan
terminal.ansiGreen
terminal.ansiMagenta
terminal.ansiRed
terminal.ansiWhite
terminal.ansiYellow
terminal.background
terminal.foreground
terminal.selectionBackground
terminalCursor.background
terminalCursor.foreground
titleBar.activeBackground
titleBar.activeForeground
walkThrough.embeddedEditorBackground
widget.foreground

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
keyword, keyword.control, keyword.operator, keyword.other, keyword.function#7F7FFFbold
storage, storage.type, storage.modifier, storage.type.ts, storage.type.js#CDCCDB—
variable, variable.other#FFFFFF—
comment, comment.block, comment.line, comment.block.js, meta.class.js, meta.export.default.js, source.js, punctuation.definition.comment.ts, comment.block.documentation.ts, source.ts#B1B1BA—
constant#FFFFFF—
entity#7F5DBF—
entity.name.function#CC3980—
invalid#FF7F7F—
string#27AE60—
support#7FBaff—
markup.heading#7F5DBF—
markup.deleted#FF7F7F—
markup.inserted#27AE60—
markup.changed#7F3FBF—
markup.underline—underline
markup.underline.link#7F7FFF—
markup.list, markup.raw#FFFFFF—