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#1e2737
  • activityBar.background#fafbfc
  • activityBar.border#e1e4e8
  • activityBar.foreground#1e2737
  • activityBar.inactiveForeground#1e273779
  • activityBarBadge.background#d1ab66
  • button.background#d1ab66
  • button.foreground#ffffff
  • button.hoverBackground#d1ab66e0
  • editor.background#ffffff
  • editor.findMatchBackground#39465e10
  • editor.findMatchHighlightBackground#39465e10
  • editor.foreground#1e2737
  • editor.hoverHighlightBackground#39465e10
  • editor.lineHighlightBackground#1e273705
  • editor.lineHighlightBorder#1e273705
  • editor.rangeHighlightBackground#6c6f931a
  • editor.selectionBackground#00000010
  • editor.selectionHighlightBackground#39465e10
  • editor.selectionHighlightBorder#1e273740
  • editor.wordHighlightBackground#d1ab6638
  • editor.wordHighlightStrongBackground#d1ab6670
  • editorBracketMatch.background#f1f8ff
  • editorBracketMatch.border#1e273780
  • editorGroupHeader.tabsBackground#fafbfc
  • editorGroupHeader.tabsBorder#e1e4e8
  • editorIndentGuide.background1#eeeeee
  • editorLineNumber.activeForeground#1e2737
  • editorLineNumber.foreground#cccccc
  • focusBorder#1e2737
  • gitDecoration.addedResourceForeground#8fc8bb
  • gitDecoration.deletedResourceForeground#e78482
  • gitDecoration.ignoredResourceForeground#14141441
  • gitDecoration.modifiedResourceForeground#d1ab66
  • gitDecoration.untrackedResourceForeground#d1ab66
  • inlineChat.regionHighlight#1e273705
  • inputOption.activeBorder#d1ab66
  • list.activeSelectionBackground#1e273713
  • list.activeSelectionForeground#1e2737
  • list.activeSelectionIconForeground#1e2737
  • list.deemphasizedForeground#1e273713
  • list.dropBackground#6c6f9380
  • list.errorForeground#e78482
  • list.focusBackground#1e273713
  • list.focusForeground#1e2737
  • list.focusHighlightForeground#1e2737
  • list.highlightForeground#1e2737
  • list.hoverBackground#1e273713
  • list.hoverForeground#1e2737
  • list.inactiveFocusBackground#1e273713
  • list.inactiveSelectionBackground#1e273713
  • list.inactiveSelectionForeground#1e2737
  • list.invalidItemForeground#d1ab66
  • list.warningForeground#d1ab66
  • scrollbar.shadow#00000000
  • searchEditor.findMatchBackground#6c6f931a
  • sideBar.background#fafbfc
  • sideBar.border#e1e4e8
  • sideBar.foreground#1e2737
  • sideBarSectionHeader.background#f1f2f3
  • sideBarSectionHeader.foreground#1e2737
  • sideBarTitle.foreground#1e2737
  • statusBar.background#ffffff
  • statusBar.border#e1e4e8
  • statusBar.debuggingBackground#fafbfc
  • statusBar.debuggingForeground#1e2737
  • statusBar.foreground#1e2737
  • statusBar.noFolderBackground#fafbfc
  • statusBar.noFolderForeground#1e2737
  • statusBarItem.hoverBackground#e1e4e8
  • statusBarItem.remoteBackground#d1ab66
  • statusBarItem.remoteForeground#1e2737
  • statusBarItem.remoteHoverBackground#e1e4e8
  • statusBarItem.remoteHoverForeground#1e2737
  • tab.activeBackground#ffffff
  • tab.activeBorder#fafbfc
  • tab.activeBorderTop#1e2737
  • tab.border#e1e4e8
  • tab.inactiveBackground#fafbfc
  • tab.inactiveForeground#586069
  • terminal.ansiBlue#6db3ce
  • terminal.ansiBrightBlue#78c3df
  • terminal.ansiBrightCyan#35d8d9
  • terminal.ansiBrightGreen#a1ded0
  • terminal.ansiBrightMagenta#bf91e0
  • terminal.ansiBrightRed#fb918f
  • terminal.ansiBrightYellow#e0b972
  • terminal.ansiCyan#2fc2c3
  • terminal.ansiGreen#8fc8bb
  • terminal.ansiMagenta#ad82cb
  • terminal.ansiRed#e78482
  • terminal.ansiYellow#d1ab66
  • titleBar.activeBackground#fafbfc
  • titleBar.border#e1e4e8

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, keyword.codetag.notation.python#98a8c5italic
constant, constant.numeric.bin.python, storage.type.number.python#ad82cb
constant.character.escape, constant.language.python#6db3ce
entity.name, punctuation.definition.arguments.begin.python, punctuation.definition.arguments.end.python, meta.function-call.arguments.python, punctuation.definition.list.begin.python, punctuation.definition.list.end.python#39465e
entity.name.function, entity.name.type.class.python, meta.function-call.python, support.function.magic.python#d1ab66bold
entity.name.tag#2fc2c3
entity.other.attribute-name, support.type.exception.python#e78482
entity.other.attribute-name.class.css#74829b
support.type.property-name.css#d1ab66
entity.other.attribute-name.id#d1ab66
constant.other.color.rgb-value.hex.css#d1ab66
meta.at-rule.mixin, meta.at-rule.include#d1ab66
punctuation.definition.parameters.begin.bracket.round, punctuation.definition.parameters.end.bracket.round#39465e
entity.other.inherited-class#d1ab66
constant.numeric.css#8fc8bb
keyword.other.unit#39465e
entity.other.attribute-name.pseudo-element, entity.other.attribute-name.pseudo-class#e78482
entity.name.variable, variable#1e2737
keyword, storage.type.function.python, storage.type.class.python#ad82cb
keyword.operator#6db3ce
keyword.operator.new, keyword.operator.expression, keyword.operator.logical, keyword.operator.delete#6db3ce
markup.quote#6db3ceitalic
markup.heading, entity.name.section#e78482
markup.bold#ad82cbbold
markup.italic#2fc2c3italic
markup.inline.raw, markup.fenced_code.block#e78482
markup.underline.link#d1ab66
storage#39465e
string.quoted, string.template, storage.type.string.python, string.regexp.quoted.single.python#74829b
support.type.property-name, meta.object-literal.key#d1ab66
support.function.misc.scss, support.function.misc.css#8fc8bb
variable.language#d1ab66
support.type.property-name.css, punctuation.definition.tag, punctuation.separator, string.template meta.embedded, variable.parameter, string.regexp, string.other.link#39465e
punctuation.definition.template-expression#74829b
punctuation.section.embedded#ad82cb
punctuation.definition.list#e78482