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#5F75F2
  • activityBar.background#060608
  • activityBar.foreground#D9DCE6
  • activityBar.inactiveForeground#8B8FA399
  • activityBarBadge.background#5F75F2
  • activityBarBadge.foreground#FFFFFF
  • badge.background#5F75F2
  • badge.foreground#FFFFFF
  • button.background#5F75F2
  • button.foreground#FFFFFF
  • button.hoverBackground#7C8CF8
  • dropdown.background#101015
  • dropdown.foreground#D9DCE6
  • editor.background#0A0A0C
  • editor.findMatchBackground#5F75F255
  • editor.findMatchHighlightBackground#5F75F22A
  • editor.foreground#D9DCE6
  • editor.lineHighlightBackground#101015
  • editor.selectionBackground#5F75F240
  • editor.selectionHighlightBackground#5F75F240
  • editor.wordHighlightBackground#5F75F222
  • editorBracketHighlight.foreground1#7C8CF8
  • editorBracketHighlight.foreground2#5EEAD4
  • editorBracketHighlight.foreground3#8B9DFF
  • editorBracketHighlight.foreground4#C792EA
  • editorBracketHighlight.foreground5#F0A35E
  • editorBracketHighlight.foreground6#56D4DD
  • editorBracketHighlight.unexpectedBracket.foreground#EF4444
  • editorBracketMatch.background#5F75F233
  • editorBracketMatch.border#5F75F200
  • editorCursor.foreground#5F75F2
  • editorError.foreground#EF4444
  • editorGroupHeader.tabsBackground#060608
  • editorGutter.background#0A0A0C
  • editorHint.foreground#5F75F2
  • editorHoverWidget.background#060608
  • editorHoverWidget.border#1A1B22
  • editorIndentGuide.activeBackground1#5F75F266
  • editorIndentGuide.background1#1A1B22
  • editorInfo.foreground#8B9DFF
  • editorLineNumber.activeForeground#5F75F2
  • editorLineNumber.foreground#8B8FA366
  • editorSuggestWidget.background#060608
  • editorSuggestWidget.highlightForeground#7C8CF8
  • editorSuggestWidget.selectedBackground#5F75F226
  • editorWarning.foreground#F59E0B
  • editorWhitespace.foreground#1A1B22
  • editorWidget.background#060608
  • editorWidget.border#1A1B22
  • focusBorder#5F75F288
  • foreground#D9DCE6
  • gitDecoration.addedResourceForeground#5EEAD4
  • gitDecoration.deletedResourceForeground#EF4444
  • gitDecoration.modifiedResourceForeground#F0A35E
  • gitDecoration.untrackedResourceForeground#56D4DD
  • input.background#101015
  • input.border#1A1B22
  • input.foreground#D9DCE6
  • inputOption.activeBorder#5F75F2
  • list.activeSelectionBackground#5F75F226
  • list.activeSelectionForeground#D9DCE6
  • list.highlightForeground#7C8CF8
  • list.hoverBackground#101015
  • list.inactiveSelectionBackground#101015
  • minimap.selectionHighlight#5F75F2
  • notificationCenterHeader.background#060608
  • notifications.background#060608
  • panel.background#08080A
  • panel.border#1A1B22
  • panelTitle.activeBorder#5F75F2
  • panelTitle.activeForeground#D9DCE6
  • peekViewEditor.background#101015
  • progressBar.background#5F75F2
  • scrollbarSlider.activeBackground#5F75F266
  • scrollbarSlider.background#8B8FA322
  • scrollbarSlider.hoverBackground#8B8FA344
  • selection.background#5F75F240
  • sideBar.background#060608
  • sideBar.foreground#8B8FA3
  • sideBarSectionHeader.background#060608
  • sideBarSectionHeader.foreground#D9DCE6
  • sideBarTitle.foreground#D9DCE6
  • statusBar.background#060608
  • statusBar.debuggingBackground#5F75F2
  • statusBar.debuggingForeground#FFFFFF
  • statusBar.foreground#8B8FA3
  • statusBar.noFolderBackground#060608
  • statusBarItem.remoteBackground#5F75F2
  • statusBarItem.remoteForeground#FFFFFF
  • tab.activeBackground#0A0A0C
  • tab.activeBorder#5F75F200
  • tab.activeBorderTop#5F75F2
  • tab.activeForeground#D9DCE6
  • tab.border#060608
  • tab.inactiveBackground#060608
  • tab.inactiveForeground#8B8FA3
  • terminal.ansiBlue#8B9DFF
  • terminal.ansiBrightBlue#8B9DFF
  • terminal.ansiBrightGreen#5EEAD4
  • terminal.ansiBrightMagenta#C792EA
  • terminal.ansiCyan#5EEAD4
  • terminal.ansiGreen#5EEAD4
  • terminal.ansiMagenta#C792EA
  • terminal.ansiRed#EF4444
  • terminal.ansiYellow#F0A35E
  • terminal.background#08080A
  • terminal.foreground#D9DCE6
  • terminalCursor.foreground#5F75F2
  • textLink.activeForeground#5F75F2
  • textLink.foreground#7C8CF8
  • titleBar.activeBackground#060608
  • titleBar.activeForeground#D9DCE6
  • titleBar.inactiveBackground#060608
  • titleBar.inactiveForeground#8B8FA3
  • tree.indentGuidesStroke#1A1B22

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#5A5F73italic
string#5EEAD4—
string.quoted.docstring, string.quoted.multi.python#5A5F73italic
constant.numeric, constant.numeric.python#C792EA—
constant.language, constant.language.python#C792EA—
constant.character, constant.other#C792EA—
keyword, keyword.control, keyword.control.flow.python, keyword.control.import.python#7C8CF8bold
keyword.operator, keyword.operator.logical.python, keyword.operator.python#9DA8FF—
storage, storage.type, storage.type.function.python, storage.type.class.python, storage.modifier#7C8CF8italic
entity.name.function, meta.function-call.python, support.function, support.function.builtin.python#8B9DFF—
entity.name.class, entity.name.type, entity.name.type.class.python, support.type, support.class#56D4DDbold
support.type.python, meta.function.parameters.python support.type#5EEAD4—
variable, variable.other, meta.variable.python#D9DCE6—
variable.parameter, variable.parameter.function-call.python#B8C0E8italic
variable.language.special.self.python, variable.language.special.cls.python, variable.language#F0A35Eitalic
meta.decorator, entity.name.function.decorator.python, punctuation.definition.decorator.python#F0A35E—
meta.import, keyword.control.import#7C8CF8—
entity.name.namespace, support.module#56D4DD—
punctuation, punctuation.separator, punctuation.definition#8B8FA3—
meta.string.regexp, string.regexp#F0A35E—
meta.fstring.python, string.interpolated.python#5EEAD4—
constant.character.format.placeholder, meta.interpolation.python#7C8CF8bold
meta.typehint.python, meta.function.return-type.python#5EEAD4italic
markup.heading, entity.name.section#7C8CF8bold
markup.bold#D9DCE6bold
markup.italic#D9DCE6italic
markup.inline.raw, markup.fenced_code#5EEAD4—
support.type.property-name.json#8B9DFF—
invalid, invalid.illegal#EF4444—