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#04D361
  • activityBar.background#09110D
  • activityBar.foreground#DCEAE2
  • activityBar.inactiveForeground#8FA89B99
  • activityBarBadge.background#04D361
  • activityBarBadge.foreground#FFFFFF
  • badge.background#04D361
  • badge.foreground#FFFFFF
  • button.background#04D361
  • button.foreground#FFFFFF
  • button.hoverBackground#29E0A9
  • dropdown.background#13201B
  • dropdown.foreground#DCEAE2
  • editor.background#0E1512
  • editor.findMatchBackground#04D36155
  • editor.findMatchHighlightBackground#04D3612A
  • editor.foreground#DCEAE2
  • editor.lineHighlightBackground#13201B
  • editor.selectionBackground#04D36138
  • editor.selectionHighlightBackground#04D36138
  • editor.wordHighlightBackground#04D36122
  • editorBracketHighlight.foreground1#29E0A9
  • editorBracketHighlight.foreground2#7DD3FC
  • editorBracketHighlight.foreground3#22D3A8
  • editorBracketHighlight.foreground4#FBBF77
  • editorBracketHighlight.foreground5#FCD34D
  • editorBracketHighlight.foreground6#5EEAD4
  • editorBracketHighlight.unexpectedBracket.foreground#EF4444
  • editorBracketMatch.background#04D36133
  • editorBracketMatch.border#04D36100
  • editorCursor.foreground#04D361
  • editorError.foreground#EF4444
  • editorGroupHeader.tabsBackground#09110D
  • editorGutter.background#0E1512
  • editorHint.foreground#04D361
  • editorHoverWidget.background#09110D
  • editorHoverWidget.border#1C2A23
  • editorIndentGuide.activeBackground1#04D36166
  • editorIndentGuide.background1#1C2A23
  • editorInfo.foreground#22D3A8
  • editorLineNumber.activeForeground#04D361
  • editorLineNumber.foreground#8FA89B66
  • editorSuggestWidget.background#09110D
  • editorSuggestWidget.highlightForeground#29E0A9
  • editorSuggestWidget.selectedBackground#04D36126
  • editorWarning.foreground#F59E0B
  • editorWhitespace.foreground#1C2A23
  • editorWidget.background#09110D
  • editorWidget.border#1C2A23
  • focusBorder#04D36188
  • foreground#DCEAE2
  • gitDecoration.addedResourceForeground#7DD3FC
  • gitDecoration.deletedResourceForeground#EF4444
  • gitDecoration.modifiedResourceForeground#FCD34D
  • gitDecoration.untrackedResourceForeground#5EEAD4
  • input.background#13201B
  • input.border#1C2A23
  • input.foreground#DCEAE2
  • inputOption.activeBorder#04D361
  • list.activeSelectionBackground#04D36126
  • list.activeSelectionForeground#DCEAE2
  • list.highlightForeground#29E0A9
  • list.hoverBackground#13201B
  • list.inactiveSelectionBackground#13201B
  • minimap.selectionHighlight#04D361
  • notificationCenterHeader.background#09110D
  • notifications.background#09110D
  • panel.background#0A120F
  • panel.border#1C2A23
  • panelTitle.activeBorder#04D361
  • panelTitle.activeForeground#DCEAE2
  • peekViewEditor.background#13201B
  • progressBar.background#04D361
  • scrollbarSlider.activeBackground#04D36166
  • scrollbarSlider.background#8FA89B22
  • scrollbarSlider.hoverBackground#8FA89B44
  • selection.background#04D36138
  • sideBar.background#09110D
  • sideBar.foreground#8FA89B
  • sideBarSectionHeader.background#09110D
  • sideBarSectionHeader.foreground#DCEAE2
  • sideBarTitle.foreground#DCEAE2
  • statusBar.background#09110D
  • statusBar.debuggingBackground#04D361
  • statusBar.debuggingForeground#FFFFFF
  • statusBar.foreground#8FA89B
  • statusBar.noFolderBackground#09110D
  • statusBarItem.remoteBackground#04D361
  • statusBarItem.remoteForeground#FFFFFF
  • tab.activeBackground#0E1512
  • tab.activeBorder#04D36100
  • tab.activeBorderTop#04D361
  • tab.activeForeground#DCEAE2
  • tab.border#09110D
  • tab.inactiveBackground#09110D
  • tab.inactiveForeground#8FA89B
  • terminal.ansiBlue#22D3A8
  • terminal.ansiBrightBlue#22D3A8
  • terminal.ansiBrightGreen#7DD3FC
  • terminal.ansiBrightMagenta#FBBF77
  • terminal.ansiCyan#5EEAD4
  • terminal.ansiGreen#7DD3FC
  • terminal.ansiMagenta#FBBF77
  • terminal.ansiRed#EF4444
  • terminal.ansiYellow#FCD34D
  • terminal.background#0A120F
  • terminal.foreground#DCEAE2
  • terminalCursor.foreground#04D361
  • textLink.activeForeground#04D361
  • textLink.foreground#29E0A9
  • titleBar.activeBackground#09110D
  • titleBar.activeForeground#DCEAE2
  • titleBar.inactiveBackground#09110D
  • titleBar.inactiveForeground#8FA89B
  • tree.indentGuidesStroke#1C2A23

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#5E7368italic
string#7DD3FC—
string.quoted.docstring, string.quoted.multi.python#5E7368italic
constant.numeric, constant.numeric.python#FBBF77—
constant.language, constant.language.python#FBBF77—
constant.character, constant.other#FBBF77—
keyword, keyword.control, keyword.control.flow.python, keyword.control.import.python#34D399bold
keyword.operator, keyword.operator.logical.python, keyword.operator.python#6EE7B7—
storage, storage.type, storage.type.function.python, storage.type.class.python, storage.modifier#34D399italic
entity.name.function, meta.function-call.python, support.function, support.function.builtin.python#22D3A8—
entity.name.class, entity.name.type, entity.name.type.class.python, support.type, support.class#5EEAD4bold
support.type.python, meta.function.parameters.python support.type#5EEAD4—
variable, variable.other, meta.variable.python#DCEAE2—
variable.parameter, variable.parameter.function-call.python#A7D8C5italic
variable.language.special.self.python, variable.language.special.cls.python, variable.language#FCD34Ditalic
meta.decorator, entity.name.function.decorator.python, punctuation.definition.decorator.python#FCD34D—
meta.import, keyword.control.import#34D399—
entity.name.namespace, support.module#5EEAD4—
punctuation, punctuation.separator, punctuation.definition#8FA89B—
meta.string.regexp, string.regexp#FCD34D—
meta.fstring.python, string.interpolated.python#7DD3FC—
constant.character.format.placeholder, meta.interpolation.python#29E0A9bold
meta.typehint.python, meta.function.return-type.python#5EEAD4italic
markup.heading, entity.name.section#29E0A9bold
markup.bold#DCEAE2bold
markup.italic#DCEAE2italic
markup.inline.raw, markup.fenced_code#7DD3FC—
support.type.property-name.json#22D3A8—
invalid, invalid.illegal#EF4444—