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#fbf5dd
  • activityBar.border#e8dbb0
  • activityBar.foreground#ea580c
  • activityBar.inactiveForeground#57534e
  • activityBarBadge.background#ea580c
  • activityBarBadge.foreground#ffffff
  • badge.background#ea580c
  • badge.foreground#ffffff
  • breadcrumb.activeSelectionForeground#ea580c
  • breadcrumb.focusForeground#ea580c
  • breadcrumb.foreground#57534e
  • button.background#ea580c
  • button.foreground#ffffff
  • button.hoverBackground#c2410c
  • dropdown.background#ffffff
  • dropdown.border#e8dbb0
  • dropdown.foreground#1c1917
  • editor.background#fffdf2
  • editor.findMatchBackground#facc1560
  • editor.findMatchHighlightBackground#facc1530
  • editor.foreground#1c1917
  • editor.inactiveSelectionBackground#e8dbb040
  • editor.selectionBackground#ea580c30
  • editor.selectionHighlightBackground#ea580c15
  • editor.wordHighlightBackground#1a365d20
  • editorCursor.foreground#ea580c
  • editorGroupHeader.border#e8dbb0
  • editorGroupHeader.tabsBackground#fbf5dd
  • editorLineNumber.activeForeground#ea580c
  • editorLineNumber.foreground#57534e
  • focusBorder#ea580c
  • foreground#1c1917
  • gitDecoration.deletedResourceForeground#c53030
  • gitDecoration.modifiedResourceForeground#b45309
  • gitDecoration.untrackedResourceForeground#15803d
  • input.background#ffffff
  • input.border#e8dbb0
  • input.foreground#1c1917
  • input.placeholderForeground#57534e
  • list.activeSelectionBackground#e8dbb060
  • list.activeSelectionForeground#ea580c
  • list.hoverBackground#f4eac5
  • list.inactiveSelectionBackground#f4eac5
  • sideBar.background#fbf5dd
  • sideBar.border#e8dbb0
  • sideBar.foreground#1c1917
  • sideBarSectionHeader.background#fbf5dd
  • sideBarSectionHeader.foreground#ea580c
  • sideBarTitle.foreground#1c1917
  • statusBar.background#f4eac5
  • statusBar.debuggingBackground#ea580c
  • statusBar.debuggingForeground#ffffff
  • statusBar.foreground#ea580c
  • statusBar.noFolderBackground#fbf5dd
  • statusBarItem.hoverBackground#f4eac5
  • tab.activeBackground#fffdf2
  • tab.activeBorder#ea580c
  • tab.activeForeground#1c1917
  • tab.border#e8dbb0
  • tab.hoverBackground#f4eac5
  • tab.inactiveBackground#fbf5dd
  • tab.inactiveForeground#57534e
  • terminal.ansiBlack#1c1917
  • terminal.ansiBlue#1a365d
  • terminal.ansiBrightBlack#57534e
  • terminal.ansiBrightBlue#1a365d
  • terminal.ansiBrightCyan#0d9488
  • terminal.ansiBrightGreen#15803d
  • terminal.ansiBrightMagenta#9333ea
  • terminal.ansiBrightRed#c53030
  • terminal.ansiBrightWhite#1c1917
  • terminal.ansiBrightYellow#b45309
  • terminal.ansiCyan#0d9488
  • terminal.ansiGreen#15803d
  • terminal.ansiMagenta#9333ea
  • terminal.ansiRed#c53030
  • terminal.ansiWhite#78716c
  • terminal.ansiYellow#b45309
  • terminal.background#fffdf2
  • terminal.foreground#1c1917
  • terminalCursor.foreground#ea580c
  • titleBar.activeBackground#fbf5dd
  • titleBar.activeForeground#1c1917
  • titleBar.border#e8dbb0
  • titleBar.inactiveBackground#fffdf2
  • titleBar.inactiveForeground#57534e

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#78716citalic
variable, string constant.other.placeholder#1a365d
constant.other.color#1c1917
invalid, invalid.illegal#c53030
keyword, storage.type, storage.modifier#9333ea
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#ea580c
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#c53030
entity.name.function, meta.function-call, variable.function, support.function, keyword.other.special-method#1a365d
meta.block variable.other#1c1917
support.other.variable, string.other.link#db2777
constant.numeric, constant.language, support.constant, constant.character, constant.escape, variable.parameter, keyword.other.unit, keyword.other#ea580c
string, constant.other.symbol, constant.other.key, entity.other.inherited-class, markup.heading, markup.inserted.git_gutter, meta.group.braces.curly constant.other.object.key.js string.unquoted.label.js#15803d
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#b45309
support.type#0d9488
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#6d28d9
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#1a365d
variable.language#1a365ditalic
entity.name.method.js#1a365ditalic
meta.class-method.js entity.name.function.js, variable.function.constructor#1a365d
entity.other.attribute-name#6d28d9
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name#ea580citalic
entity.other.attribute-name.class#6d28d9
source.sass keyword.control#1a365d
markup.inserted#15803d
markup.deleted#c53030
markup.changed#1a365d
string.regexp#0d9488
constant.character.escape#0d9488
*url*, *link*, *uri*underline
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js#9333eaitalic
source.js constant.other.object.key.js string.unquoted.label.js#ea580citalic
source.json meta.structure.dictionary.json support.type.property-name.json#1a365d
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#9333ea
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#c53030
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#ea580c
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#15803d
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#0d9488
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#6d28d9
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#b45309
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#0284c7
text.html.markdown, punctuation.definition.list_item.markdown#1c1917
text.html.markdown markup.inline.raw.markdown#db2777
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown#78716c
markdown.heading, markup.heading | markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown#9333ea
markup.italic#db2777italic
markup.bold, markup.bold string#9333eabold
markup.bold markup.italic, markup.italic markup.bold, markup.quote markup.bold, markup.bold markup.italic string, markup.italic markup.bold string, markup.quote markup.bold string#db2777bold
markup.underline#1a365dunderline
markup.quote punctuation.definition.blockquote.markdown#78716c
markup.quoteitalic
string.other.link.title.markdown#1a365d
string.other.link.description.title.markdown#9333ea
constant.other.reference.link.markdown#ea580c
markup.raw.block#db2777
markup.raw.block.fenced.markdown#1c191715
punctuation.definition.fenced.markdown#1c191715
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end#1c1917
variable.language.fenced.markdown#78716c
meta.separator#78716cbold
markup.table#1c1917
BearTheme by GabrielTeles - VS Code Theme