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.background#F4F6F7
  • activityBar.border#00000015
  • activityBar.foreground#0B0D0D
  • activityBar.inactiveForeground#1A1B1D60
  • activityBarBadge.background#0B0D0D
  • activityBarBadge.foreground#F4F6F7
  • button.background#0B0D0D
  • button.foreground#F4F6F7
  • button.hoverBackground#0B0D0Ddd
  • editor.background#F4F6F7
  • editor.foreground#1A1B1D
  • editor.inactiveSelectionBackground#A7C7D62580
  • editor.lineHighlightBackground#FFFFFF50
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#A7C7D625
  • editorCursor.foreground#0B0D0D
  • editorGroupHeader.tabsBackground#FFFFFFaa
  • editorLineNumber.activeForeground#0B0D0D
  • editorLineNumber.foreground#D9DEE280
  • focusBorder#0B0D0D
  • foreground#1A1B1D
  • input.background#FFFFFF
  • input.border#00000015
  • input.foreground#1A1B1D
  • input.placeholderForeground#1A1B1D60
  • list.activeSelectionBackground#0B0D0D30
  • list.activeSelectionForeground#1A1B1D
  • list.highlightForeground#0B0D0D
  • list.hoverBackground#FFFFFF40
  • list.hoverForeground#1A1B1D
  • list.inactiveSelectionBackground#0B0D0D15
  • list.inactiveSelectionForeground#1A1B1D
  • selection.background#A7C7D625
  • sideBar.background#FFFFFF
  • sideBar.border#00000015
  • sideBar.foreground#1A1B1D
  • sideBarSectionHeader.background#FFFFFF80
  • sideBarSectionHeader.foreground#1A1B1D
  • sideBarTitle.foreground#0B0D0D
  • statusBar.background#F4F6F7
  • statusBar.border#00000015
  • statusBar.foreground#1A1B1D
  • statusBar.noFolderBackground#F4F6F7
  • tab.activeBackground#F4F6F7
  • tab.activeBorderTop#0B0D0D
  • tab.activeForeground#1A1B1D
  • tab.border#00000015
  • tab.inactiveBackground#F4F6F760
  • tab.inactiveForeground#1A1B1D80
  • terminal.ansiBlack#1A1B1D
  • terminal.ansiBlue#A7C7D6
  • terminal.ansiCyan#5E7F4A
  • terminal.ansiGreen#0B0D0D
  • terminal.ansiMagenta#DAA017
  • terminal.ansiRed#DAA017
  • terminal.ansiWhite#1A1B1D
  • terminal.ansiYellow#5E7F4A
  • terminal.background#F4F6F7
  • terminal.foreground#1A1B1D
  • titleBar.activeBackground#F4F6F7
  • titleBar.activeForeground#1A1B1D
  • titleBar.border#00000015
  • titleBar.inactiveBackground#F4F6F7
  • titleBar.inactiveForeground#1A1B1D60
  • widget.border#00000015

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#D9DEE2italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#A7C7D6bold
storage.type, storage.modifier#A7C7D6italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#0B0D0D
string, punctuation.definition.string, string.template, meta.template.expression#5E7F4A
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#DAA017
variable, variable.other.readwrite, variable.other.object#1A1B1D
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#1A1B1D
variable.parameter, meta.parameter#1A1B1Ddditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#1A1B1D80
keyword.operator#1A1B1D
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#5E7F4Abold
entity.other.inherited-class#0B0D0D
entity.name.tag, punctuation.definition.tag#A7C7D6
entity.other.attribute-name#0B0D0D
meta.diff, meta.diff.header#D9DEE2
markup.deleted#DAA017
markup.inserted#0B0D0D
markup.changed#5E7F4A
markup.heading, markup.heading.setext, punctuation.definition.heading#0B0D0Dbold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#5E7F4A
string.other.link.title, string.other.link.description#0B0D0D
markup.underline.link#D9DEE2underline
punctuation.definition.list#A7C7D6
markup.quote, punctuation.definition.quote#D9DEE2italic