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#FBFCFE
  • activityBar.border#00000015
  • activityBar.foreground#255193
  • activityBar.inactiveForeground#10131a60
  • activityBarBadge.background#255193
  • activityBarBadge.foreground#FBFCFE
  • button.background#255193
  • button.foreground#FBFCFE
  • button.hoverBackground#255193dd
  • editor.background#FBFCFE
  • editor.foreground#10131a
  • editor.inactiveSelectionBackground#2149832580
  • editor.lineHighlightBackground#F3F7FB50
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#21498325
  • editorCursor.foreground#255193
  • editorGroupHeader.tabsBackground#F3F7FBaa
  • editorLineNumber.activeForeground#255193
  • editorLineNumber.foreground#c6ced880
  • focusBorder#255193
  • foreground#10131a
  • input.background#F3F7FB
  • input.border#00000015
  • input.foreground#10131a
  • input.placeholderForeground#10131a60
  • list.activeSelectionBackground#25519330
  • list.activeSelectionForeground#10131a
  • list.highlightForeground#255193
  • list.hoverBackground#F3F7FB40
  • list.hoverForeground#10131a
  • list.inactiveSelectionBackground#25519315
  • list.inactiveSelectionForeground#10131a
  • selection.background#21498325
  • sideBar.background#F3F7FB
  • sideBar.border#00000015
  • sideBar.foreground#10131a
  • sideBarSectionHeader.background#F3F7FB80
  • sideBarSectionHeader.foreground#10131a
  • sideBarTitle.foreground#255193
  • statusBar.background#FBFCFE
  • statusBar.border#00000015
  • statusBar.foreground#10131a
  • statusBar.noFolderBackground#FBFCFE
  • tab.activeBackground#FBFCFE
  • tab.activeBorderTop#255193
  • tab.activeForeground#10131a
  • tab.border#00000015
  • tab.inactiveBackground#FBFCFE60
  • tab.inactiveForeground#10131a80
  • terminal.ansiBlack#10131a
  • terminal.ansiBlue#214983
  • terminal.ansiCyan#296AA3
  • terminal.ansiGreen#255193
  • terminal.ansiMagenta#193B76
  • terminal.ansiRed#193B76
  • terminal.ansiWhite#10131a
  • terminal.ansiYellow#296AA3
  • terminal.background#FBFCFE
  • terminal.foreground#10131a
  • titleBar.activeBackground#FBFCFE
  • titleBar.activeForeground#10131a
  • titleBar.border#00000015
  • titleBar.inactiveBackground#FBFCFE
  • titleBar.inactiveForeground#10131a60
  • widget.border#00000015

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#c6ced8italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#214983bold
storage.type, storage.modifier#214983italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#255193
string, punctuation.definition.string, string.template, meta.template.expression#296AA3
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#193B76
variable, variable.other.readwrite, variable.other.object#10131a
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#10131a
variable.parameter, meta.parameter#10131additalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#10131a80
keyword.operator#10131a
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#296AA3bold
entity.other.inherited-class#255193
entity.name.tag, punctuation.definition.tag#214983
entity.other.attribute-name#255193
meta.diff, meta.diff.header#c6ced8
markup.deleted#193B76
markup.inserted#255193
markup.changed#296AA3
markup.heading, markup.heading.setext, punctuation.definition.heading#255193bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#296AA3
string.other.link.title, string.other.link.description#255193
markup.underline.link#c6ced8underline
punctuation.definition.list#214983
markup.quote, punctuation.definition.quote#c6ced8italic