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#f2f4f2
  • activityBar.border#00000015
  • activityBar.foreground#214d63
  • activityBar.inactiveForeground#11131860
  • activityBarBadge.background#214d63
  • activityBarBadge.foreground#f2f4f2
  • button.background#214d63
  • button.foreground#f2f4f2
  • button.hoverBackground#214d63dd
  • editor.background#f2f4f2
  • editor.foreground#111318
  • editor.inactiveSelectionBackground#4f5d472580
  • editor.lineHighlightBackground#c7cbc650
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#4f5d4725
  • editorCursor.foreground#214d63
  • editorGroupHeader.tabsBackground#c7cbc6aa
  • editorLineNumber.activeForeground#214d63
  • editorLineNumber.foreground#58636b80
  • focusBorder#214d63
  • foreground#111318
  • input.background#c7cbc6
  • input.border#00000015
  • input.foreground#111318
  • input.placeholderForeground#11131860
  • list.activeSelectionBackground#214d6330
  • list.activeSelectionForeground#111318
  • list.highlightForeground#214d63
  • list.hoverBackground#c7cbc640
  • list.hoverForeground#111318
  • list.inactiveSelectionBackground#214d6315
  • list.inactiveSelectionForeground#111318
  • selection.background#4f5d4725
  • sideBar.background#c7cbc6
  • sideBar.border#00000015
  • sideBar.foreground#111318
  • sideBarSectionHeader.background#c7cbc680
  • sideBarSectionHeader.foreground#111318
  • sideBarTitle.foreground#214d63
  • statusBar.background#f2f4f2
  • statusBar.border#00000015
  • statusBar.foreground#111318
  • statusBar.noFolderBackground#f2f4f2
  • tab.activeBackground#f2f4f2
  • tab.activeBorderTop#214d63
  • tab.activeForeground#111318
  • tab.border#00000015
  • tab.inactiveBackground#f2f4f260
  • tab.inactiveForeground#11131880
  • terminal.ansiBlack#111318
  • terminal.ansiBlue#4f5d47
  • terminal.ansiCyan#b5c46a
  • terminal.ansiGreen#214d63
  • terminal.ansiMagenta#b85b45
  • terminal.ansiRed#b85b45
  • terminal.ansiWhite#111318
  • terminal.ansiYellow#b5c46a
  • terminal.background#f2f4f2
  • terminal.foreground#111318
  • titleBar.activeBackground#f2f4f2
  • titleBar.activeForeground#111318
  • titleBar.border#00000015
  • titleBar.inactiveBackground#f2f4f2
  • titleBar.inactiveForeground#11131860
  • widget.border#00000015

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#58636bitalic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#4f5d47bold
storage.type, storage.modifier#4f5d47italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#214d63
string, punctuation.definition.string, string.template, meta.template.expression#b5c46a
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#b85b45
variable, variable.other.readwrite, variable.other.object#111318
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#111318
variable.parameter, meta.parameter#111318dditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#11131880
keyword.operator#111318
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#b5c46abold
entity.other.inherited-class#214d63
entity.name.tag, punctuation.definition.tag#4f5d47
entity.other.attribute-name#214d63
meta.diff, meta.diff.header#58636b
markup.deleted#b85b45
markup.inserted#214d63
markup.changed#b5c46a
markup.heading, markup.heading.setext, punctuation.definition.heading#214d63bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#b5c46a
string.other.link.title, string.other.link.description#214d63
markup.underline.link#58636bunderline
punctuation.definition.list#4f5d47
markup.quote, punctuation.definition.quote#58636bitalic