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

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#faf7f2
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#faf7f2
variable.parameter, meta.parameter#faf7f2dditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#faf7f280
keyword.operator#faf7f2
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