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#1F1C16
  • activityBar.foreground#B2AA9A
  • button.background#9B3D99
  • button.foreground#E8D7C7
  • button.hoverBackground#45074B
  • editor.background#26231C
  • editor.foreground#B2AA9A
  • editor.lineHighlightBackground#2D2A2450
  • editor.selectionBackground#45074B80
  • editor.selectionHighlightBackground#45074B40
  • editor.wordHighlightBackground#0B7F9940
  • editorGroupHeader.tabsBackground#1F1C16
  • input.background#2D2A24
  • input.border#69645A
  • input.foreground#B2AA9A
  • list.activeSelectionBackground#45074B
  • list.activeSelectionForeground#E8D7C7
  • list.hoverBackground#2D2A24
  • list.hoverForeground#B2AA9A
  • sideBar.background#26231C
  • sideBar.border#2D2A24
  • sideBar.foreground#B2AA9A
  • statusBar.background#1F1C16
  • statusBar.foreground#B2AA9A
  • tab.activeBackground#26231C
  • tab.activeBorder#9B3D99
  • tab.activeBorderBottom#9B3D99
  • tab.activeForeground#B2AA9A
  • tab.inactiveBackground#1F1C16
  • tab.inactiveForeground#69645A
  • terminal.ansiBlack#1F1C16
  • terminal.ansiBlue#0B7F99
  • terminal.ansiBrightBlack#69645A
  • terminal.ansiBrightBlue#0B7F99
  • terminal.ansiBrightCyan#186644
  • terminal.ansiBrightGreen#6C7D0F
  • terminal.ansiBrightMagenta#9B3D99
  • terminal.ansiBrightRed#8C1F3D
  • terminal.ansiBrightWhite#E8D7C7
  • terminal.ansiBrightYellow#944A00
  • terminal.ansiCyan#186644
  • terminal.ansiGreen#6C7D0F
  • terminal.ansiMagenta#9B3D99
  • terminal.ansiRed#8C1F3D
  • terminal.ansiWhite#B2AA9A
  • terminal.ansiYellow#944A00
  • titleBar.activeBackground#1F1C16
  • titleBar.activeForeground#B2AA9A

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#69645A
variable, string constant.other.placeholder#B2AA9A
constant.other.color#E8D7C7
invalid, invalid.illegal#8C1F3D
keyword, storage.type, storage.modifier#9B3D99
keyword.control, constant.other.color, punctuation, meta.tag, punctuation.definition.tag, punctuation.separator.inheritance.php, punctuation.definition.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, punctuation.section.embedded, keyword.other.template, keyword.other.substitution#69645A
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#0B7F99
entity.name.function, meta.function-call, variable.function, support.function, keyword.other.special-method#0B7F99
meta.block variable.other#B2AA9A
support.other.variable, string.other.link#8C1F3D
constant.numeric, constant.language, support.constant, constant.character, constant.escape, variable.parameter, keyword.other.unit, keyword.other#944A00
string, constant.other.symbol, constant.other.key, markup.heading, markup.inserted.git_gutter, meta.group.braces.curly constant.other.object.key.js string.unquoted.label.js#6C7D0F
entity.name, support.type, support.class, support.other.namespace.use.php, meta.use.php, support.other.namespace.php, markup.changed.git_gutter, support.type.sys-types#944A00
support.type#186644
source.css support.type.property-name, source.sass support.type.property-name, source.scss support.type.property-name, source.less support.type.property-name, source.stylus support.type.property-name, source.postcss support.type.property-name#186644
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#8C1F3D
variable.language#8C1F3Ditalic
entity.name.method.js#0B7F99italic
meta.class-method.js entity.name.function.js, variable.function.constructor#0B7F99
entity.other.attribute-name#9B3D99
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name#944A00italic
entity.other.attribute-name.class#944A00
markup.italic#8C1F3Ditalic
markup.bold#8C1F3Dbold
markup.heading#9B3D99bold
comment, punctuation.definition.comment#69645A
string#f49d0c
keyword#41B3C9
variable#6C7D0F
constant.numeric#f49d0c
variable.object.property, variable.other.property, variable.other.object.property#f49d0c
entity.name.tag, meta.tag, markup.deleted.git_gutter#41B3C9
support.class.component#41B3C9
entity.name.function, meta.function-call, variable.function, keyword.control#0B7F99
entity.name.type, entity.name.class, entity.other.inherited-class, variable.other.readwrite.alias#41B3C999
meta.jsx.children, meta.jsx.children.js, meta.jsx.children.tsx#E8D7C7
entity.name.function.member, variable.other.property.js, variable.other.property.ts, meta.object-literal.key, support.type.property-name.json#6C7D0F
keyword.control#C64BC499
meta.block variable.other#6C7D0F