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.

  • activityBar.activeBorder#c2bdba
  • activityBar.background#1d1917
  • activityBar.border#4b423d60
  • activityBar.foreground#e7f5f5
  • activityBarBadge.background#c2bdba
  • activityBarBadge.foreground#000000
  • badge.background#00000030
  • badge.foreground#4a4a4a
  • breadcrumb.activeSelectionForeground#c2bdba
  • breadcrumb.background#1d1917
  • breadcrumb.focusForeground#e7f5f5
  • breadcrumb.foreground#928076
  • breadcrumbPicker.background#1d1917
  • button.background#6c5e5650
  • button.foreground#ffffff
  • debugConsole.errorForeground#e97c82
  • debugConsole.infoForeground#92d8f5
  • debugConsole.warningForeground#f6c977
  • debugToolBar.background#25201d
  • diffEditor.insertedTextBackground#92d8f520
  • diffEditor.removedTextBackground#f6a1ae20
  • dropdown.background#25201d
  • dropdown.border#ffffff10
  • editor.background#181513
  • editor.findMatchBackground#000000
  • editor.findMatchBorder#c2bdba
  • editor.findMatchHighlightBackground#00000050
  • editor.findMatchHighlightBorder#ffffff50
  • editor.findRangeHighlightBackground#f6c97730
  • editor.foreground#e7e5e4
  • editor.lineHighlightBackground#e7e5e413
  • editor.lineHighlightBorder#00000000
  • editor.rangeHighlightBackground#ffffff0d
  • editor.selectionBackground#e7e5e414
  • editor.selectionHighlightBackground#f6ca1c20
  • editor.wordHighlightBackground#e7e5e415
  • editor.wordHighlightStrongBackground#e7e5e430
  • editorBracketHighlight.foreground1#88d1ff
  • editorBracketHighlight.foreground2#edc68e
  • editorBracketHighlight.foreground3#ce9cf1
  • editorBracketHighlight.foreground4#c3e697
  • editorBracketHighlight.foreground5#9ed5f6
  • editorBracketHighlight.foreground6#ffb38b
  • editorBracketHighlight.unexpectedBracket.foreground#ff8f82
  • editorBracketMatch.background#25201d
  • editorBracketMatch.border#f6ca1c50
  • editorCursor.foreground#f6ca1c
  • editorError.foreground#e97c8270
  • editorGroup.border#00000030
  • editorGroup.dropBackground#e97c8280
  • editorGroup.focusedEmptyBorder#e97c82
  • editorGroupHeader.border#4b423d61
  • editorGroupHeader.tabsBackground#1d1917
  • editorGutter.addedBackground#c3e29460
  • editorGutter.deletedBackground#e97c8260
  • editorGutter.modifiedBackground#8cadf560
  • editorHoverWidget.background#25201d
  • editorHoverWidget.border#ffffff10
  • editorInfo.foreground#8cadf570
  • editorInlayHint.foreground#a99b93c0
  • editorLineNumber.activeForeground#928076
  • editorLineNumber.foreground#49403b
  • editorLink.activeForeground#e7f5f5
  • editorMarkerNavigation.background#e7f5f505
  • editorOverviewRuler.border#25201d
  • editorOverviewRuler.errorForeground#e97c8240
  • editorOverviewRuler.findMatchForeground#c2bdba87
  • editorOverviewRuler.infoForeground#8cadf540
  • editorOverviewRuler.warningForeground#f6c97740
  • editorRuler.foreground#49403b
  • editorSuggestWidget.background#25201d
  • editorSuggestWidget.border#ffffff10
  • editorSuggestWidget.foreground#e7f5f5
  • editorSuggestWidget.highlightForeground#c2bdba
  • editorSuggestWidget.selectedBackground#00000050
  • editorWarning.foreground#f6c97770
  • editorWhitespace.foreground#e7f5f540
  • editorWidget.background#1d1917
  • editorWidget.border#4b423d60
  • editorWidget.resizeBorder#c2bdba
  • extensionBadge.remoteForeground#e7f5f5
  • extensionButton.prominentBackground#c3e29490
  • extensionButton.prominentForeground#e7f5f5
  • extensionButton.prominentHoverBackground#c3e294
  • focusBorder#ffffff00
  • foreground#e7f5f5
  • gitDecoration.conflictingResourceForeground#f6c97790
  • gitDecoration.deletedResourceForeground#e97c8290
  • gitDecoration.ignoredResourceForeground#92807690
  • gitDecoration.modifiedResourceForeground#8cadf590
  • gitDecoration.untrackedResourceForeground#c3e29490
  • input.background#302a26
  • input.border#ffffff10
  • input.foreground#e7f5f5
  • input.placeholderForeground#e7f5f560
  • inputOption.activeBackground#e7f5f530
  • inputOption.activeBorder#e7f5f530
  • inputValidation.errorBorder#e97c82
  • inputValidation.infoBorder#8cadf5
  • inputValidation.warningBorder#f6c977
  • list.activeSelectionBackground#ffffff10
  • list.activeSelectionForeground#c2bdba
  • list.dropBackground#e97c8280
  • list.focusBackground#e7f5f520
  • list.focusForeground#e7f5f5
  • list.highlightForeground#c2bdba
  • list.hoverBackground#ffffff0a
  • list.hoverForeground#ffffff
  • list.inactiveSelectionBackground#ffffff10
  • list.inactiveSelectionForeground#c2bdba
  • listFilterWidget.background#00000030
  • listFilterWidget.noMatchesOutline#00000030
  • listFilterWidget.outline#00000030
  • menu.background#25201d
  • menu.foreground#e7f5f5
  • menu.selectionBackground#00000050
  • menu.selectionBorder#00000030
  • menu.selectionForeground#c2bdba
  • menu.separatorBackground#e7f5f5
  • menubar.selectionBackground#00000030
  • menubar.selectionBorder#00000030
  • menubar.selectionForeground#c2bdba
  • notebook.focusedCellBorder#c2bdba
  • notebook.inactiveFocusedCellBorder#c2bdba50
  • notificationLink.foreground#c2bdba
  • notifications.background#25201d
  • notifications.foreground#e7f5f5
  • panel.background#1d1917
  • panel.border#4b423d60
  • panelTitle.activeBorder#c2bdba
  • panelTitle.activeForeground#ffffff
  • panelTitle.inactiveForeground#e7f5f5
  • peekView.border#00000030
  • peekViewEditor.background#00000000
  • peekViewEditor.matchHighlightBackground#6c5e5650
  • peekViewEditorGutter.background#302a26
  • peekViewResult.background#302a26
  • peekViewResult.matchHighlightBackground#6c5e5650
  • peekViewResult.selectionBackground#92807670
  • peekViewTitle.background#302a26
  • peekViewTitleDescription.foreground#e7f5f560
  • pickerGroup.border#ffffff1a
  • pickerGroup.foreground#c2bdba
  • progressBar.background#c2bdba
  • quickInput.background#25201d
  • quickInput.foreground#928076
  • sash.hoverBorder#c2bdba50
  • scrollbar.shadow#00000030
  • scrollbarSlider.activeBackground#c2bdba
  • scrollbarSlider.background#e7f5f520
  • scrollbarSlider.hoverBackground#e7f5f510
  • selection.background#00000080
  • settings.checkboxBackground#1d1917
  • settings.checkboxForeground#e7f5f5
  • settings.dropdownBackground#1d1917
  • settings.dropdownForeground#e7f5f5
  • settings.headerForeground#c2bdba
  • settings.modifiedItemIndicator#c2bdba
  • settings.numberInputBackground#1d1917
  • settings.numberInputForeground#e7f5f5
  • settings.textInputBackground#1d1917
  • settings.textInputForeground#e7f5f5
  • sideBar.background#1d1917
  • sideBar.border#4b423d60
  • sideBar.foreground#928076
  • sideBarSectionHeader.background#1d1917
  • sideBarSectionHeader.border#4b423d60
  • sideBarTitle.foreground#e7f5f5
  • statusBar.background#181513
  • statusBar.border#4b423d60
  • statusBar.debuggingBackground#c698e3
  • statusBar.debuggingForeground#ffffff
  • statusBar.foreground#6c5e56
  • statusBar.noFolderBackground#25201d
  • statusBarItem.activeBackground#e97c8280
  • statusBarItem.hoverBackground#4a4a4a20
  • statusBarItem.remoteBackground#c2bdba
  • statusBarItem.remoteForeground#000000
  • tab.activeBackground#ffffff10
  • tab.activeBorder#c2bdba
  • tab.activeForeground#ffffff
  • tab.activeModifiedBorder#928076
  • tab.border#1d1917
  • tab.hoverBackground#ffffff0a
  • tab.inactiveBackground#1d1917
  • tab.inactiveForeground#928076
  • tab.inactiveModifiedBorder#985559
  • tab.unfocusedActiveBorder#4a4a4a
  • tab.unfocusedActiveForeground#e7f5f5
  • tab.unfocusedActiveModifiedBorder#c0696e
  • tab.unfocusedInactiveModifiedBorder#985559
  • terminal.ansiBlack#000000
  • terminal.ansiBlue#8cadf5
  • terminal.ansiBrightBlack#4a4a4a
  • terminal.ansiBrightBlue#b7cbf5
  • terminal.ansiBrightCyan#bde5f5
  • terminal.ansiBrightGreen#d6e9b7
  • terminal.ansiBrightMagenta#d9bdea
  • terminal.ansiBrightRed#eda4a7
  • terminal.ansiBrightWhite#ffffff
  • terminal.ansiBrightYellow#f6d8a2
  • terminal.ansiCyan#92d8f5
  • terminal.ansiGreen#c3e294
  • terminal.ansiMagenta#c698e3
  • terminal.ansiRed#e97c82
  • terminal.ansiWhite#d9d9d9
  • terminal.ansiYellow#f6c977
  • terminal.background#1d1917
  • terminal.foreground#e7e5e4
  • terminal.selectionBackground#e7e5e426
  • terminalCursor.background#000000
  • terminalCursor.foreground#f6ca1c
  • textLink.activeForeground#e7f5f5
  • textLink.foreground#c2bdba
  • titleBar.activeBackground#1d1917
  • titleBar.activeForeground#e7f5f5
  • titleBar.border#4b423d60
  • titleBar.inactiveBackground#1d1917
  • titleBar.inactiveForeground#928076
  • tree.indentGuidesStroke#49403b
  • widget.shadow#00000030

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
markup.underline—underline
variable.parameter—italic
support.type.property-name.css#A7D2E5—
constant.other.symbol, meta.tag, punctuation, template.expression.begin, template.expression.end, text.html.markdown beginning.punctuation.definition.list#9E948D—
markup.bold#F08489bold
markup.bold markup.italic, markup.italic markup.bold#F08489italic bold
constant.language, entity.name.section.group-title.ini, keyword, markup.heading, modifier, support.type.object, variable.language.this#79BCE0—
markup.italic, support.module, support.node, variable.parameter.function.language.special.self.python#F08489italic
constant.keyword, keyword.control, markup.quote#79BCE0italic
SXNested, constant.character.escape, markup.fenced_code.block, meta.definition.variable entity.name.function, meta.embedded, meta.function-call.arguments, meta.jsx.children, meta.template.expression, punctuation.definition.entity.html, source.cpp meta.block variable.other, source.cs entity.name.type.namespace, source.groovy.embedded, source.php meta.use support.class, source.php support.other.namespace, support.constant, support.variable, text.html constant.character.entity.named, variable#E7E5E4—
constant.other.key, entity.name, entity.other, entity.other.attribute-name.class, meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json, meta.use, source.cs meta.class.identifier storage.type, source.cs meta.method.return-type, source.cs storage.type, source.css entity.name.tag, support.class, support.type#FBCF7E—
constant.character.format.placeholder.other.python, constant.numeric, entity.other.attribute-name.id, keyword.other, meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#F59C80—
constant.other.placeholder, entity.name.tag, keyword.other.definition.ini, markup.deleted, meta.block, meta.definition.method entity.name.function, meta.field.declaration entity.name.function, meta.link.reference, meta.object-literal.key, meta.object-literal.key string, meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json, source.cs meta.method.identifier entity.name.function, source.python meta.member.access.python, support.type.property-name.json, text.html.markdown meta.link.inline, variable.object.property#F08489—
meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#CF845A—
entity.name.function, meta.function entity.name.function, meta.function-call.arguments, meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json, source.cs entity.name.function, source.cs meta.method-call meta.method, source.python meta.function-call.python, support.function#89B3F5—
constant.language.boolean, meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json, punctuation.definition.quote#F6A2AD—
entity.other.attribute-name, meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json, meta.structure.dictionary.json support.type.property-name.json, storage.control, storage.modifier, storage.type#B9A5F1—
markup.fenced_code.block.markdown punctuation.definition.markdown, markup.inline.raw.string.markdown, markup.inserted, meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json, string#C9E598—
source.cs meta.preprocessor#71635B—
comment, comment punctuation.definition.comment, punctuation.definition.comment, string.quoted.docstring#8E7C72italic
token.info-token#6796E6—
token.warn-token#CD9731—
token.error-token#F44747—
token.debug-token#B267E6—