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.

keyHEXRGBRGBA
activityBar.background
badge.background
breadcrumb.background
breadcrumbPicker.background
button.background
checkbox.background
checkbox.selectBackground
debugExceptionWidget.background
debugExceptionWidget.border
debugToolBar.background
dropdown.background
dropdown.border
editor.background
editor.findMatchBackground
editor.findMatchHighlightBackground
editor.findRangeHighlightBackground
editor.foreground
editor.selectionBackground
editor.selectionHighlightBackground
editor.wordHighlightBackground
editor.wordHighlightStrongBackground
editorBracketHighlight.foreground1
editorBracketHighlight.foreground2
editorBracketHighlight.foreground3
editorCursor.foreground
editorGroup.border
editorGroup.dropBackground
editorGroup.dropIntoPromptBackground
editorGroupHeader.noTabsBackground
editorGroupHeader.tabsBackground
editorGutter.background
editorGutter.commentGlyphForeground
editorGutter.commentUnresolvedGlyphForeground
editorHoverWidget.background
editorIndentGuide.activeBackground
editorIndentGuide.background
editorLineNumber.activeForeground
editorLineNumber.foreground
editorMarkerNavigation.background
editorMarkerNavigationError.background
editorMarkerNavigationWarning.background
editorPane.background
editorStickyScroll.background
editorSuggestWidget.background
editorSuggestWidget.foreground
editorSuggestWidgetStatus.foreground
editorWhitespace.foreground
editorWidget.background
errorForeground
focusBorder
input.background
input.foreground
input.placeholderForeground
inputOption.activeBorder
inputValidation.errorBackground
inputValidation.errorBorder
inputValidation.infoBackground
inputValidation.infoBorder
inputValidation.warningBackground
inputValidation.warningBorder
list.activeSelectionBackground
list.dropBackground
list.highlightForeground
list.hoverBackground
list.inactiveSelectionBackground
listFilterWidget.background
menu.background
minimap.selectionHighlight
notebook.cellEditorBackground
notebook.editorBackground
notifications.background
panel.background
panel.border
peekView.border
peekViewEditor.background
peekViewEditor.matchHighlightBackground
peekViewResult.background
peekViewTitle.background
pickerGroup.border
pickerGroup.foreground
ports.iconRunningProcessForeground
progressBar.background
quickInput.background
quickInputList.focusBackground
selection.background
settings.checkboxBackground
settings.dropdownBackground
sideBar.background
sideBarTitle.foreground
sideBySideEditor.horizontalBorder
sideBySideEditor.verticalBorder
statusBar.background
statusBar.debuggingBackground
statusBar.foreground
statusBar.noFolderBackground
statusBarItem.prominentBackground
statusBarItem.prominentHoverBackground
statusBarItem.remoteBackground
tab.activeBackground
tab.activeForeground
tab.border
tab.inactiveBackground
tab.inactiveForeground
tab.lastPinnedBorder
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
testing.message.info.decorationForeground
titleBar.activeBackground
welcomePage.tileBackground

tokenColors

Foregrounds this theme assigns to the token scope catalog. A rule with only a font style is skipped, and a longer matching scope wins. Italic and bold rules are not listed — the preview above shows them in the code.

scopeHEXRGBRGBA
comment
comment.block
comment.block.documentation
comment.line
invalid
invalid.deprecated
invalid.illegal
markup
markup.bold
markup.changed
markup.deleted
markup.heading
markup.inline.raw
markup.inserted
markup.italic
markup.list
markup.list.numbered
markup.list.unnumbered
markup.quote
meta
string
string.quoted

Related themes