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#faf7f2
  • activityBar.border#00000015
  • activityBar.foreground#ff7a1a
  • activityBar.inactiveForeground#3A2A3660
  • activityBarBadge.background#ff7a1a
  • activityBarBadge.foreground#faf7f2
  • button.background#ff7a1a
  • button.foreground#faf7f2
  • button.hoverBackground#ff7a1add
  • editor.background#faf7f2
  • editor.foreground#3A2A36
  • editor.inactiveSelectionBackground#FFE4C22580
  • editor.lineHighlightBackground#f2f4f150
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#FFE4C225
  • editorCursor.foreground#ff7a1a
  • editorGroupHeader.tabsBackground#f2f4f1aa
  • editorLineNumber.activeForeground#ff7a1a
  • editorLineNumber.foreground#dde4d880
  • focusBorder#ff7a1a
  • foreground#3A2A36
  • input.background#f2f4f1
  • input.border#00000015
  • input.foreground#3A2A36
  • input.placeholderForeground#3A2A3660
  • list.activeSelectionBackground#ff7a1a30
  • list.activeSelectionForeground#3A2A36
  • list.highlightForeground#ff7a1a
  • list.hoverBackground#f2f4f140
  • list.hoverForeground#3A2A36
  • list.inactiveSelectionBackground#ff7a1a15
  • list.inactiveSelectionForeground#3A2A36
  • selection.background#FFE4C225
  • sideBar.background#f2f4f1
  • sideBar.border#00000015
  • sideBar.foreground#3A2A36
  • sideBarSectionHeader.background#f2f4f180
  • sideBarSectionHeader.foreground#3A2A36
  • sideBarTitle.foreground#ff7a1a
  • statusBar.background#faf7f2
  • statusBar.border#00000015
  • statusBar.foreground#3A2A36
  • statusBar.noFolderBackground#faf7f2
  • tab.activeBackground#faf7f2
  • tab.activeBorderTop#ff7a1a
  • tab.activeForeground#3A2A36
  • tab.border#00000015
  • tab.inactiveBackground#faf7f260
  • tab.inactiveForeground#3A2A3680
  • terminal.ansiBlack#3A2A36
  • terminal.ansiBlue#FFE4C2
  • terminal.ansiCyan#a6b1a2
  • terminal.ansiGreen#ff7a1a
  • terminal.ansiMagenta#6daa88
  • terminal.ansiRed#6daa88
  • terminal.ansiWhite#3A2A36
  • terminal.ansiYellow#a6b1a2
  • terminal.background#faf7f2
  • terminal.foreground#3A2A36
  • titleBar.activeBackground#faf7f2
  • titleBar.activeForeground#3A2A36
  • titleBar.border#00000015
  • titleBar.inactiveBackground#faf7f2
  • titleBar.inactiveForeground#3A2A3660
  • widget.border#00000015

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#dde4d8italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#FFE4C2bold
storage.type, storage.modifier#FFE4C2italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#ff7a1a
string, punctuation.definition.string, string.template, meta.template.expression#a6b1a2
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#6daa88
variable, variable.other.readwrite, variable.other.object#3A2A36
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#3A2A36
variable.parameter, meta.parameter#3A2A36dditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#3A2A3680
keyword.operator#3A2A36
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#a6b1a2bold
entity.other.inherited-class#ff7a1a
entity.name.tag, punctuation.definition.tag#FFE4C2
entity.other.attribute-name#ff7a1a
meta.diff, meta.diff.header#dde4d8
markup.deleted#6daa88
markup.inserted#ff7a1a
markup.changed#a6b1a2
markup.heading, markup.heading.setext, punctuation.definition.heading#ff7a1abold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#a6b1a2
string.other.link.title, string.other.link.description#ff7a1a
markup.underline.link#dde4d8underline
punctuation.definition.list#FFE4C2
markup.quote, punctuation.definition.quote#dde4d8italic