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#181926
  • activityBar.border#363a4f
  • activityBar.foreground#c6a0f6
  • activityBar.inactiveForeground#a5adcb
  • activityBarBadge.background#f5bde6
  • activityBarBadge.foreground#11111b
  • badge.background#c6a0f6
  • badge.foreground#11111b
  • breadcrumb.activeSelectionForeground#c6a0f6
  • breadcrumb.focusForeground#c6a0f6
  • breadcrumb.foreground#a5adcb
  • button.background#c6a0f6
  • button.foreground#11111b
  • button.hoverBackground#b7bdf8
  • dropdown.background#1e2030
  • dropdown.border#363a4f
  • dropdown.foreground#cad3f5
  • editor.background#24273a
  • editor.findMatchBackground#ed879660
  • editor.findMatchHighlightBackground#ed879630
  • editor.foreground#cad3f5
  • editor.inactiveSelectionBackground#494d6440
  • editor.selectionBackground#5b607850
  • editor.selectionHighlightBackground#c6a0f625
  • editor.wordHighlightBackground#8aadf425
  • editorCursor.foreground#c6a0f6
  • editorGroupHeader.border#363a4f
  • editorGroupHeader.tabsBackground#1e2030
  • editorLineNumber.activeForeground#c6a0f6
  • editorLineNumber.foreground#a5adcb
  • focusBorder#c6a0f6
  • foreground#cad3f5
  • gitDecoration.deletedResourceForeground#ed8796
  • gitDecoration.modifiedResourceForeground#eed49f
  • gitDecoration.untrackedResourceForeground#a6da95
  • input.background#1e2030
  • input.border#363a4f
  • input.foreground#cad3f5
  • input.placeholderForeground#a5adcb
  • list.activeSelectionBackground#363a4f80
  • list.activeSelectionForeground#c6a0f6
  • list.hoverBackground#363a4f
  • list.inactiveSelectionBackground#363a4f
  • sideBar.background#1e2030
  • sideBar.border#363a4f
  • sideBar.foreground#cad3f5
  • sideBarSectionHeader.background#181926
  • sideBarSectionHeader.foreground#c6a0f6
  • sideBarTitle.foreground#cad3f5
  • statusBar.background#181926
  • statusBar.debuggingBackground#f5a97f
  • statusBar.debuggingForeground#ffffff
  • statusBar.foreground#c6a0f6
  • statusBar.noFolderBackground#181926
  • statusBarItem.hoverBackground#363a4f
  • tab.activeBackground#24273a
  • tab.activeBorder#c6a0f6
  • tab.activeForeground#cad3f5
  • tab.border#363a4f
  • tab.hoverBackground#363a4f
  • tab.inactiveBackground#1e2030
  • tab.inactiveForeground#a5adcb
  • terminal.ansiBlack#494d64
  • terminal.ansiBlue#8aadf4
  • terminal.ansiBrightBlack#a5adcb
  • terminal.ansiBrightBlue#8aadf4
  • terminal.ansiBrightCyan#8bd5ca
  • terminal.ansiBrightGreen#a6da95
  • terminal.ansiBrightMagenta#c6a0f6
  • terminal.ansiBrightRed#ed8796
  • terminal.ansiBrightWhite#a5adcb
  • terminal.ansiBrightYellow#eed49f
  • terminal.ansiCyan#8bd5ca
  • terminal.ansiGreen#a6da95
  • terminal.ansiMagenta#c6a0f6
  • terminal.ansiRed#ed8796
  • terminal.ansiWhite#b8c0e0
  • terminal.ansiYellow#eed49f
  • terminal.background#24273a
  • terminal.foreground#cad3f5
  • terminalCursor.foreground#c6a0f6
  • titleBar.activeBackground#181926
  • titleBar.activeForeground#cad3f5
  • titleBar.border#363a4f
  • titleBar.inactiveBackground#24273a
  • titleBar.inactiveForeground#a5adcb

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#6e738ditalic
variable, string constant.other.placeholder#f4dbd6
constant.other.color#cad3f5
invalid, invalid.illegal#ed8796
keyword, storage.type, storage.modifier#c6a0f6
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#f5a97f
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#ed8796
entity.name.function, meta.function-call, variable.function, support.function, keyword.other.special-method#8aadf4
meta.block variable.other#cad3f5
support.other.variable, string.other.link#f5bde6
constant.numeric, constant.language, support.constant, constant.character, constant.escape, variable.parameter, keyword.other.unit, keyword.other#f5a97f
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#a6da95
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#eed49f
support.type#8bd5ca
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#b7bdf8
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#8aadf4
variable.language#f4dbd6italic
entity.name.method.js#8aadf4italic
meta.class-method.js entity.name.function.js, variable.function.constructor#8aadf4
entity.other.attribute-name#b7bdf8
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name#f5a97fitalic
entity.other.attribute-name.class#b7bdf8
source.sass keyword.control#8aadf4
markup.inserted#a6da95
markup.deleted#ed8796
markup.changed#8aadf4
string.regexp#8bd5ca
constant.character.escape#8bd5ca
*url*, *link*, *uri*underline
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js#c6a0f6italic
source.js constant.other.object.key.js string.unquoted.label.js#f5a97fitalic
source.json meta.structure.dictionary.json support.type.property-name.json#8aadf4
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#c6a0f6
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#ed8796
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#f5a97f
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#a6da95
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#8bd5ca
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#b7bdf8
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#eed49f
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#91d7e3
text.html.markdown, punctuation.definition.list_item.markdown#cad3f5
text.html.markdown markup.inline.raw.markdown#f5bde6
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown#6e738d
markdown.heading, markup.heading | markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown#c6a0f6
markup.italic#f5bde6italic
markup.bold, markup.bold string#c6a0f6bold
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#f5bde6bold
markup.underline#8aadf4underline
markup.quote punctuation.definition.blockquote.markdown#6e738d
markup.quoteitalic
string.other.link.title.markdown#8aadf4
string.other.link.description.title.markdown#c6a0f6
constant.other.reference.link.markdown#f5a97f
markup.raw.block#f5bde6
markup.raw.block.fenced.markdown#cad3f515
punctuation.definition.fenced.markdown#cad3f515
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end#cad3f5
variable.language.fenced.markdown#6e738d
meta.separator#6e738dbold
markup.table#cad3f5
BearTheme by GabrielTeles - VS Code Theme