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#f7f5f0
  • activityBar.border#00000015
  • activityBar.foreground#f47a21
  • activityBar.inactiveForeground#11111160
  • activityBarBadge.background#f47a21
  • activityBarBadge.foreground#f7f5f0
  • button.background#f47a21
  • button.foreground#f7f5f0
  • button.hoverBackground#f47a21dd
  • editor.background#f7f5f0
  • editor.foreground#111111
  • editor.inactiveSelectionBackground#3e68492580
  • editor.lineHighlightBackground#d9b48c50
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#3e684925
  • editorCursor.foreground#f47a21
  • editorGroupHeader.tabsBackground#d9b48caa
  • editorLineNumber.activeForeground#f47a21
  • editorLineNumber.foreground#e6e2da80
  • focusBorder#f47a21
  • foreground#111111
  • input.background#d9b48c
  • input.border#00000015
  • input.foreground#111111
  • input.placeholderForeground#11111160
  • list.activeSelectionBackground#f47a2130
  • list.activeSelectionForeground#111111
  • list.highlightForeground#f47a21
  • list.hoverBackground#d9b48c40
  • list.hoverForeground#111111
  • list.inactiveSelectionBackground#f47a2115
  • list.inactiveSelectionForeground#111111
  • selection.background#3e684925
  • sideBar.background#d9b48c
  • sideBar.border#00000015
  • sideBar.foreground#111111
  • sideBarSectionHeader.background#d9b48c80
  • sideBarSectionHeader.foreground#111111
  • sideBarTitle.foreground#f47a21
  • statusBar.background#f7f5f0
  • statusBar.border#00000015
  • statusBar.foreground#111111
  • statusBar.noFolderBackground#f7f5f0
  • tab.activeBackground#f7f5f0
  • tab.activeBorderTop#f47a21
  • tab.activeForeground#111111
  • tab.border#00000015
  • tab.inactiveBackground#f7f5f060
  • tab.inactiveForeground#11111180
  • terminal.ansiBlack#111111
  • terminal.ansiBlue#3e6849
  • terminal.ansiCyan#ffb300
  • terminal.ansiGreen#f47a21
  • terminal.ansiMagenta#d9b48c
  • terminal.ansiRed#d9b48c
  • terminal.ansiWhite#111111
  • terminal.ansiYellow#ffb300
  • terminal.background#f7f5f0
  • terminal.foreground#111111
  • titleBar.activeBackground#f7f5f0
  • titleBar.activeForeground#111111
  • titleBar.border#00000015
  • titleBar.inactiveBackground#f7f5f0
  • titleBar.inactiveForeground#11111160
  • widget.border#00000015

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#e6e2daitalic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#3e6849bold
storage.type, storage.modifier#3e6849italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#f47a21
string, punctuation.definition.string, string.template, meta.template.expression#ffb300
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#d9b48c
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#ffb300bold
entity.other.inherited-class#f47a21
entity.name.tag, punctuation.definition.tag#3e6849
entity.other.attribute-name#f47a21
meta.diff, meta.diff.header#e6e2da
markup.deleted#d9b48c
markup.inserted#f47a21
markup.changed#ffb300
markup.heading, markup.heading.setext, punctuation.definition.heading#f47a21bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#ffb300
string.other.link.title, string.other.link.description#f47a21
markup.underline.link#e6e2daunderline
punctuation.definition.list#3e6849
markup.quote, punctuation.definition.quote#e6e2daitalic
Morphous Theme by Ameyanagi - VS Code Theme