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#EDE4DE
  • activityBar.foreground#2A1A12
  • badge.background#3A7AAA
  • badge.foreground#FFFFFF
  • button.background#3A7AAA
  • button.foreground#FFFFFF
  • dropdown.background#FFFFFF
  • dropdown.foreground#2A1A12
  • editor.background#FDF8F5
  • editor.foreground#2A1A12
  • editor.lineHighlightBackground#F5F0EC
  • editor.selectionBackground#D0E4F0
  • editorBracketMatch.background#D0E4F040
  • editorBracketMatch.border#3A7AAA
  • editorCursor.foreground#B8960A
  • editorLineNumber.activeForeground#B8960A
  • editorLineNumber.foreground#B0A098
  • input.background#FFFFFF
  • input.border#D8C8BE
  • input.foreground#2A1A12
  • list.activeSelectionBackground#D0E4F0
  • list.hoverBackground#F0E8E2
  • panel.background#F5EDE8
  • sideBar.background#F5EDE8
  • sideBar.foreground#2A1A12
  • sideBarTitle.foreground#3A7AAA
  • statusBar.background#3A7AAA
  • statusBar.foreground#FFFFFF
  • tab.activeBackground#FDF8F5
  • tab.activeForeground#2A1A12
  • tab.inactiveBackground#F5EDE8
  • terminal.background#FDF8F5
  • terminal.foreground#2A1A12
  • titleBar.activeBackground#F5EDE8
  • titleBar.activeForeground#2A1A12

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#9A8878italic
string, string.quoted, string.template, string.interpolated#9A7A08
constant.character.escape, string.regexp#7A5A08
punctuation.definition.template-expression, punctuation.section.embedded#2A6090
constant.numeric, constant.numeric.integer, constant.numeric.float, constant.numeric.hex#B8960A
constant.language, support.constant, constant.language.boolean, constant.language.null, constant.language.undefined#7A5A08
keyword, keyword.control, keyword.control.flow, keyword.control.conditional, keyword.control.loop#2A6090
storage.type, storage.modifier, keyword.control.def, keyword.control.class#2A6090
keyword.operator, keyword.operator.assignment, keyword.operator.arithmetic, keyword.operator.logical, keyword.operator.comparison#4A3A2A
entity.name.function, meta.function entity.name.function#7A5A08
meta.function-call entity.name.function, variable.function, support.function, meta.method-call entity.name.function, entity.name.function.call#7A5A08
support.function.builtin, support.function.magic, meta.function-call support.function#7A5A08
meta.method-call, variable.function.member#7A5A08
entity.name.type, entity.name.class, support.type, support.class, entity.name.type.class#3A7AAA
entity.other.inherited-class#3A7AAAitalic
entity.name.type.interface, entity.name.type.parameter, entity.name.type.enum#2A6090
variable, variable.other, variable.other.readwrite#2A1A12
variable.parameter, variable.parameter.function#3A2A1A
variable.other.property, variable.other.object.property, meta.object-literal.key, support.variable.property#7A5A08
variable.language, variable.language.this, variable.language.self, variable.language.special#2A6090italic
meta.decorator, entity.name.function.decorator, punctuation.definition.decorator, meta.annotation#3A7AAA
keyword.control.import, keyword.control.export, keyword.control.from, keyword.other.import#2A6090
entity.name.import, entity.name.package, support.module#9A7A08
entity.name.tag, punctuation.definition.tag#2A6090
entity.other.attribute-name#9A7A08
support.type.property-name, meta.property-name#7A5A08
support.constant.property-value, meta.property-value#9A7A08
entity.other.attribute-name.class.css, entity.other.attribute-name.id.css#3A7AAA
punctuation, punctuation.definition, punctuation.separator, punctuation.terminator#5A4A3A
markup.heading, entity.name.section#2A6090bold
markup.boldbold
markup.italicitalic
markup.inline.raw, markup.fenced_code#9A7A08
Beatles theme by sdooodly - VS Code Theme