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#F4FAF8
  • activityBar.border#00000015
  • activityBar.foreground#FF6A00
  • activityBar.inactiveForeground#11111160
  • activityBarBadge.background#FF6A00
  • activityBarBadge.foreground#F4FAF8
  • button.background#FF6A00
  • button.foreground#F4FAF8
  • button.hoverBackground#FF6A00dd
  • editor.background#F4FAF8
  • editor.foreground#111111
  • editor.inactiveSelectionBackground#FF6A002580
  • editor.lineHighlightBackground#FAFAFA50
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#FF6A0025
  • editorCursor.foreground#FF6A00
  • editorGroupHeader.tabsBackground#FAFAFAaa
  • editorLineNumber.activeForeground#FF6A00
  • editorLineNumber.foreground#E6F5F380
  • focusBorder#FF6A00
  • foreground#111111
  • input.background#FAFAFA
  • input.border#00000015
  • input.foreground#111111
  • input.placeholderForeground#11111160
  • list.activeSelectionBackground#FF6A0030
  • list.activeSelectionForeground#111111
  • list.highlightForeground#FF6A00
  • list.hoverBackground#FAFAFA40
  • list.hoverForeground#111111
  • list.inactiveSelectionBackground#FF6A0015
  • list.inactiveSelectionForeground#111111
  • selection.background#FF6A0025
  • sideBar.background#FAFAFA
  • sideBar.border#00000015
  • sideBar.foreground#111111
  • sideBarSectionHeader.background#FAFAFA80
  • sideBarSectionHeader.foreground#111111
  • sideBarTitle.foreground#FF6A00
  • statusBar.background#F4FAF8
  • statusBar.border#00000015
  • statusBar.foreground#111111
  • statusBar.noFolderBackground#F4FAF8
  • tab.activeBackground#F4FAF8
  • tab.activeBorderTop#FF6A00
  • tab.activeForeground#111111
  • tab.border#00000015
  • tab.inactiveBackground#F4FAF860
  • tab.inactiveForeground#11111180
  • terminal.ansiBlack#111111
  • terminal.ansiBlue#FF6A00
  • terminal.ansiCyan#2EA39A
  • terminal.ansiGreen#FF6A00
  • terminal.ansiMagenta#F4B84A
  • terminal.ansiRed#F4B84A
  • terminal.ansiWhite#111111
  • terminal.ansiYellow#2EA39A
  • terminal.background#F4FAF8
  • terminal.foreground#111111
  • titleBar.activeBackground#F4FAF8
  • titleBar.activeForeground#111111
  • titleBar.border#00000015
  • titleBar.inactiveBackground#F4FAF8
  • titleBar.inactiveForeground#11111160
  • widget.border#00000015

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#E6F5F3italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#FF6A00bold
storage.type, storage.modifier#FF6A00italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#FF6A00
string, punctuation.definition.string, string.template, meta.template.expression#2EA39A
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#F4B84A
variable, variable.other.readwrite, variable.other.object#111111
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#111111
variable.parameter, meta.parameter#111111dditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#11111180
keyword.operator#111111
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#2EA39Abold
entity.other.inherited-class#FF6A00
entity.name.tag, punctuation.definition.tag#FF6A00
entity.other.attribute-name#FF6A00
meta.diff, meta.diff.header#E6F5F3
markup.deleted#F4B84A
markup.inserted#FF6A00
markup.changed#2EA39A
markup.heading, markup.heading.setext, punctuation.definition.heading#FF6A00bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#2EA39A
string.other.link.title, string.other.link.description#FF6A00
markup.underline.link#E6F5F3underline
punctuation.definition.list#FF6A00
markup.quote, punctuation.definition.quote#E6F5F3italic