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.
- activityBar.background#3f3f3f
- activityBar.foreground#95c9b6
- activityBar.inactiveForeground#7ba092
- activityBarBadge.background#7ba092
- activityBarBadge.foreground#0c0c0c
- button.background#ece2ae
- button.foreground#795353
- editor.background#3f3f3f
- editor.findMatchBackground#7575753a
- editor.findMatchHighlightBackground#7575753a
- editor.hoverHighlightBackground#7575753a
- editor.selectionBackground#d38f8f32
- editor.selectionHighlightBackground#a582822a
- editor.wordHighlightBackground#7575753a
- editor.wordHighlightStrongBackground#7575753a
- editorBracketHighlight.foreground1#bfc5bf
- editorBracketHighlight.foreground2#bfc5bf
- editorBracketHighlight.foreground3#bfc5bf
- editorBracketHighlight.foreground4#bfc5bf
- editorBracketHighlight.foreground5#bfc5bf
- editorBracketHighlight.foreground6#bfc5bf
- editorBracketHighlight.unexpectedBracket.foreground#ff0000
- editorBracketMatch.background#7575753a
- editorBracketMatch.border#00000000
- editorBracketPairGuide.activeBackground1#383838
- editorBracketPairGuide.activeBackground2#383838
- editorBracketPairGuide.activeBackground3#383838
- editorBracketPairGuide.activeBackground4#383838
- editorBracketPairGuide.activeBackground5#383838
- editorBracketPairGuide.activeBackground6#383838
- editorBracketPairGuide.background1#aaaaaa
- editorBracketPairGuide.background2#aaaaaa
- editorBracketPairGuide.background3#aaaaaa
- editorBracketPairGuide.background4#aaaaaa
- editorBracketPairGuide.background5#aaaaaa
- editorBracketPairGuide.background6#aaaaaa
- editorCursor.foreground#afadad
- editorError.background#00000000
- editorError.foreground#c22121
- editorGroupHeader.tabsBackground#2e2e2e
- editorGutter.background#3f3f3f
- editorInfo.background#00000000
- editorLink.activeForeground#d6b69a
- editorWarning.background#00000000
- editorWarning.foreground#c2aa21
- editorWidget.background#3f3f3f
- sideBar.background#3f3f3f
- statusBar.background#444444
- statusBar.noFolderBackground#4c4c4c
- statusBar.noFolderForeground#ffffff
- textLink.activeForeground#95c9b6
- textLink.foreground#7ba092
- titleBar.border#252526
tokenColors
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| , string.json, string.json punctuation, meta.template.expression, source.coffee.embedded, keyword.key.toml, entity.name.tag.yaml | #BBBBBB | — |
| punctuation, meta.brace, keyword.operator.type.annotation | #FFB459 | — |
| string, punctuation.definition.string, constant, variable.language | #D6B69A | — |
| comment, comment punctuation, comment storage | #555555 | — |
| keyword, storage, support.type.primitive, support.type.builtin | #DE7E43 | bold |
| comment | #7D9C89 | — |
| punctuation.definition.comment | #7D9C89 | — |
| string | #BD9393 | — |
| meta.embedded.assembly | #BD9393 | — |
| keyword - keyword.operator | #EAE2B9 | — |
| keyword.control | #EAE2B9 | — |
| storage | #EAE2B9 | — |
| storage.type | #EAE2B9 | — |
| keyword.operator | #BFC5BF | — |
| punctuation, meta.brace, keyword.operator.type.annotation | #BFC5BF | — |
| keyword, storage, support.type.primitive, support.type.builtin | #EAE2B9 | — |
| constant, variable.language | #D6B69A | — |
| token.info-token | #6796E6 | — |
| token.warn-token | #CD9731 | — |
| token.error-token | #F44747 | — |
| token.debug-token | #B267E6 | — |