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#f7efe4
  • activityBar.border#00000015
  • activityBar.foreground#c65f28
  • activityBar.inactiveForeground#1f1c1960
  • activityBarBadge.background#c65f28
  • activityBarBadge.foreground#f7efe4
  • button.background#c65f28
  • button.foreground#f7efe4
  • button.hoverBackground#c65f28dd
  • editor.background#f7efe4
  • editor.foreground#1f1c19
  • editor.inactiveSelectionBackground#fff4e42580
  • editor.lineHighlightBackground#e5c5a550
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#fff4e425
  • editorCursor.foreground#c65f28
  • editorGroupHeader.tabsBackground#e5c5a5aa
  • editorLineNumber.activeForeground#c65f28
  • editorLineNumber.foreground#fff4e480
  • focusBorder#c65f28
  • foreground#1f1c19
  • input.background#e5c5a5
  • input.border#00000015
  • input.foreground#1f1c19
  • input.placeholderForeground#1f1c1960
  • list.activeSelectionBackground#c65f2830
  • list.activeSelectionForeground#1f1c19
  • list.highlightForeground#c65f28
  • list.hoverBackground#e5c5a540
  • list.hoverForeground#1f1c19
  • list.inactiveSelectionBackground#c65f2815
  • list.inactiveSelectionForeground#1f1c19
  • selection.background#fff4e425
  • sideBar.background#e5c5a5
  • sideBar.border#00000015
  • sideBar.foreground#1f1c19
  • sideBarSectionHeader.background#e5c5a580
  • sideBarSectionHeader.foreground#1f1c19
  • sideBarTitle.foreground#c65f28
  • statusBar.background#f7efe4
  • statusBar.border#00000015
  • statusBar.foreground#1f1c19
  • statusBar.noFolderBackground#f7efe4
  • tab.activeBackground#f7efe4
  • tab.activeBorderTop#c65f28
  • tab.activeForeground#1f1c19
  • tab.border#00000015
  • tab.inactiveBackground#f7efe460
  • tab.inactiveForeground#1f1c1980
  • terminal.ansiBlack#1f1c19
  • terminal.ansiBlue#fff4e4
  • terminal.ansiCyan#3f6f4d
  • terminal.ansiGreen#c65f28
  • terminal.ansiMagenta#8f3f20
  • terminal.ansiRed#8f3f20
  • terminal.ansiWhite#1f1c19
  • terminal.ansiYellow#3f6f4d
  • terminal.background#f7efe4
  • terminal.foreground#1f1c19
  • titleBar.activeBackground#f7efe4
  • titleBar.activeForeground#1f1c19
  • titleBar.border#00000015
  • titleBar.inactiveBackground#f7efe4
  • titleBar.inactiveForeground#1f1c1960
  • widget.border#00000015

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#fff4e4italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#fff4e4bold
storage.type, storage.modifier#fff4e4italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#c65f28
string, punctuation.definition.string, string.template, meta.template.expression#3f6f4d
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#8f3f20
variable, variable.other.readwrite, variable.other.object#1f1c19
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#1f1c19
variable.parameter, meta.parameter#1f1c19dditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#1f1c1980
keyword.operator#1f1c19
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#3f6f4dbold
entity.other.inherited-class#c65f28
entity.name.tag, punctuation.definition.tag#fff4e4
entity.other.attribute-name#c65f28
meta.diff, meta.diff.header#fff4e4
markup.deleted#8f3f20
markup.inserted#c65f28
markup.changed#3f6f4d
markup.heading, markup.heading.setext, punctuation.definition.heading#c65f28bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#3f6f4d
string.other.link.title, string.other.link.description#c65f28
markup.underline.link#fff4e4underline
punctuation.definition.list#fff4e4
markup.quote, punctuation.definition.quote#fff4e4italic
Morphous Theme by Ameyanagi - VS Code Theme