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#F7F5EF
  • activityBar.border#00000015
  • activityBar.foreground#5A6168
  • activityBar.inactiveForeground#28313660
  • activityBarBadge.background#5A6168
  • activityBarBadge.foreground#F7F5EF
  • button.background#5A6168
  • button.foreground#F7F5EF
  • button.hoverBackground#5A6168dd
  • editor.background#F7F5EF
  • editor.foreground#283136
  • editor.inactiveSelectionBackground#A69A872580
  • editor.lineHighlightBackground#F1E9DD50
  • editor.lineHighlightBorder#00000000
  • editor.selectionBackground#A69A8725
  • editorCursor.foreground#5A6168
  • editorGroupHeader.tabsBackground#F1E9DDaa
  • editorLineNumber.activeForeground#5A6168
  • editorLineNumber.foreground#B7C0BE80
  • focusBorder#5A6168
  • foreground#283136
  • input.background#F1E9DD
  • input.border#00000015
  • input.foreground#283136
  • input.placeholderForeground#28313660
  • list.activeSelectionBackground#5A616830
  • list.activeSelectionForeground#283136
  • list.highlightForeground#5A6168
  • list.hoverBackground#F1E9DD40
  • list.hoverForeground#283136
  • list.inactiveSelectionBackground#5A616815
  • list.inactiveSelectionForeground#283136
  • selection.background#A69A8725
  • sideBar.background#F1E9DD
  • sideBar.border#00000015
  • sideBar.foreground#283136
  • sideBarSectionHeader.background#F1E9DD80
  • sideBarSectionHeader.foreground#283136
  • sideBarTitle.foreground#5A6168
  • statusBar.background#F7F5EF
  • statusBar.border#00000015
  • statusBar.foreground#283136
  • statusBar.noFolderBackground#F7F5EF
  • tab.activeBackground#F7F5EF
  • tab.activeBorderTop#5A6168
  • tab.activeForeground#283136
  • tab.border#00000015
  • tab.inactiveBackground#F7F5EF60
  • tab.inactiveForeground#28313680
  • terminal.ansiBlack#283136
  • terminal.ansiBlue#A69A87
  • terminal.ansiCyan#6E8E58
  • terminal.ansiGreen#5A6168
  • terminal.ansiMagenta#FDF8F7
  • terminal.ansiRed#FDF8F7
  • terminal.ansiWhite#283136
  • terminal.ansiYellow#6E8E58
  • terminal.background#F7F5EF
  • terminal.foreground#283136
  • titleBar.activeBackground#F7F5EF
  • titleBar.activeForeground#283136
  • titleBar.border#00000015
  • titleBar.inactiveBackground#F7F5EF
  • titleBar.inactiveForeground#28313660
  • widget.border#00000015

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#B7C0BEitalic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical#A69A87bold
storage.type, storage.modifier#A69A87italic
entity.name.function, support.function, keyword.other.special-method, meta.function-call#5A6168
string, punctuation.definition.string, string.template, meta.template.expression#6E8E58
constant.numeric, constant.language, constant.character, constant.other, variable.other.constant#FDF8F7
variable, variable.other.readwrite, variable.other.object#283136
variable.other.property, support.variable.property, meta.object-literal.key, meta.object.member#283136
variable.parameter, meta.parameter#283136dditalic
punctuation.separator, punctuation.terminator, punctuation.definition.parameters, punctuation.definition.block, punctuation.section, meta.brace#28313680
keyword.operator#283136
entity.name.type, entity.name.class, entity.name.namespace, entity.name.scope-resolution, support.type, support.class, support.other.namespace#6E8E58bold
entity.other.inherited-class#5A6168
entity.name.tag, punctuation.definition.tag#A69A87
entity.other.attribute-name#5A6168
meta.diff, meta.diff.header#B7C0BE
markup.deleted#FDF8F7
markup.inserted#5A6168
markup.changed#6E8E58
markup.heading, markup.heading.setext, punctuation.definition.heading#5A6168bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.raw.block#6E8E58
string.other.link.title, string.other.link.description#5A6168
markup.underline.link#B7C0BEunderline
punctuation.definition.list#A69A87
markup.quote, punctuation.definition.quote#B7C0BEitalic
Morphous Theme by Ameyanagi - VS Code Theme