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#F8FAF1
  • activityBar.border#00000015
  • activityBar.foreground#D81B60
  • activityBar.inactiveForeground#10201560
  • activityBarBadge.background#D81B60
  • activityBarBadge.foreground#F8FAF1
  • button.background#D81B60
  • button.foreground#F8FAF1
  • button.hoverBackground#D81B60dd
  • editor.background#F8FAF1
  • editor.foreground#102015
  • editor.inactiveSelectionBackground#A6D96A2580
  • editor.lineHighlightBackground#F3F7E550
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#A6D96A25
  • editorCursor.foreground#D81B60
  • editorGroupHeader.tabsBackground#F3F7E5aa
  • editorLineNumber.activeForeground#D81B60
  • editorLineNumber.foreground#B3124C80
  • focusBorder#D81B60
  • foreground#102015
  • input.background#F3F7E5
  • input.border#00000015
  • input.foreground#102015
  • input.placeholderForeground#10201560
  • list.activeSelectionBackground#D81B6030
  • list.activeSelectionForeground#102015
  • list.highlightForeground#D81B60
  • list.hoverBackground#F3F7E540
  • list.hoverForeground#102015
  • list.inactiveSelectionBackground#D81B6015
  • list.inactiveSelectionForeground#102015
  • selection.background#A6D96A25
  • sideBar.background#F3F7E5
  • sideBar.border#00000015
  • sideBar.foreground#102015
  • sideBarSectionHeader.background#F3F7E580
  • sideBarSectionHeader.foreground#102015
  • sideBarTitle.foreground#D81B60
  • statusBar.background#F8FAF1
  • statusBar.border#00000015
  • statusBar.foreground#102015
  • statusBar.noFolderBackground#F8FAF1
  • tab.activeBackground#F8FAF1
  • tab.activeBorderTop#D81B60
  • tab.activeForeground#102015
  • tab.border#00000015
  • tab.inactiveBackground#F8FAF160
  • tab.inactiveForeground#10201580
  • terminal.ansiBlack#102015
  • terminal.ansiBlue#A6D96A
  • terminal.ansiCyan#FFD21F
  • terminal.ansiGreen#D81B60
  • terminal.ansiMagenta#83C341
  • terminal.ansiRed#83C341
  • terminal.ansiWhite#102015
  • terminal.ansiYellow#FFD21F
  • terminal.background#F8FAF1
  • terminal.foreground#102015
  • titleBar.activeBackground#F8FAF1
  • titleBar.activeForeground#102015
  • titleBar.border#00000015
  • titleBar.inactiveBackground#F8FAF1
  • titleBar.inactiveForeground#10201560
  • widget.border#00000015

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#B3124Citalic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#A6D96Abold
storage.type, storage.modifier#A6D96Aitalic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#D81B60
string, punctuation.definition.string, string.template, meta.template.expression#FFD21F
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#83C341
variable, variable.other.readwrite, variable.other.object#102015
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#102015
variable.parameter, meta.parameter#102015dditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#10201580
keyword.operator#102015
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#FFD21Fbold
entity.other.inherited-class#D81B60
entity.name.tag, punctuation.definition.tag#A6D96A
entity.other.attribute-name#D81B60
meta.diff, meta.diff.header#B3124C
markup.deleted#83C341
markup.inserted#D81B60
markup.changed#FFD21F
markup.heading, markup.heading.setext, punctuation.definition.heading#D81B60bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#FFD21F
string.other.link.title, string.other.link.description#D81B60
markup.underline.link#B3124Cunderline
punctuation.definition.list#A6D96A
markup.quote, punctuation.definition.quote#B3124Citalic
Morphous Theme by Ameyanagi - VS Code Theme