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.activeBackground
activityBar.background
activityBar.border
activityBar.foreground
activityBarBadge.background
activityBarBadge.foreground
badge.background
badge.foreground
editor.background
editor.findMatchBackground
editor.findMatchHighlightBackground
editor.foreground
editor.selectionBackground
editor.selectionHighlightBackground
editorLineNumber.activeForeground
editorLineNumber.foreground
editorUnnecessaryCode.opacity
minimapSlider.activeBackground
minimapSlider.background
minimapSlider.hoverBackground
scrollbarSlider.activeBackground
scrollbarSlider.background
scrollbarSlider.hoverBackground
sideBar.background
sideBar.foreground
sideBarSectionHeader.background
sideBarSectionHeader.foreground
statusBar.background
statusBar.border
statusBar.debuggingBackground
statusBar.foreground
statusBar.noFolderBackground
titleBar.activeBackground
titleBar.activeForeground
titleBar.border

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#15b846
invalid.illegal#ff0000—
keyword, storage, punctuation, meta.brace#3366ff—
storage.type, support.type#ff9a16—
constant.language, support.constant, variable.language#3366ff—
variable, support.variable, support.function, entity.other, support.class, entity.name, meta.object.member#ff8251—
constant.numeric, constant.character, constant, string, punctuation.definition.string#ffa783—
meta.diff.range, meta.diff.index, meta.separator#434343—
meta.diff.header.from-file#434343—
meta.diff.header.to-file#434343—