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.foreground#D6D3C9
  • activityBarBadge.background#71AABC
  • breadcrumb.activeSelectionForeground#D6D3C9
  • breadcrumb.focusForeground#D6D3C9
  • breadcrumb.foreground#B39D64
  • editor.background#1E2021
  • editor.foreground#D6D3C9
  • editor.lineHighlightBackground#252A2B
  • editor.selectionBackground#2C3536
  • editorCursor.foreground#D6D3C9
  • editorLineNumber.activeForeground#89B5A1
  • editorLineNumber.foreground#607D8B
  • editorWhitespace.foreground#3A3D3E
  • list.activeSelectionBackground#2C3536
  • list.activeSelectionForeground#D6D3C9
  • list.hoverBackground#252A2B
  • list.hoverForeground#D6D3C9
  • list.inactiveSelectionBackground#252A2B
  • list.inactiveSelectionForeground#D6D3C9
  • sideBar.background#1A1C1D
  • sideBar.foreground#B39D64
  • sideBarSectionHeader.foreground#D6D3C9
  • sideBarTitle.foreground#D6D3C9
  • statusBar.background#2C3536
  • statusBar.foreground#D6D3C9
  • tab.activeBackground#252A2B
  • tab.activeForeground#D6D3C9
  • tab.hoverBackground#2C3536
  • tab.inactiveBackground#1E2021
  • tab.inactiveForeground#B39D64

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#607D8Bitalic
variable, string constant.other.placeholder#B39D64
constant.other.color#D6D3C9
invalid, invalid.illegal#CF6679
keyword, storage.type, storage.modifier#71AABC
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#7EA6B8
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#71AABC
entity.name.function, meta.function-call, variable.function, support.function, keyword.other.special-method#D89B4A
meta.block variable.other#B39D64
support.other.variable, string.other.link#89B5A1
constant.numeric, constant.language, support.constant, constant.character, constant.escape, variable.parameter, keyword.other.unit, keyword.other#E6B583
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#89B5A1
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#C3A775
support.type#7EA6B8
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#89B5A1
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#CF6679
variable.language#E4B253italic
entity.name.method.js#D89B4Aitalic
meta.class-method.js entity.name.function.js, variable.function.constructor#D89B4A
entity.other.attribute-name#9DB8A1
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name#C3A775italic
entity.other.attribute-name.class#C3A775
source.sass keyword.control#71AABC
markup.inserted#89B5A1
markup.deleted#CF6679
markup.changed#71AABC
string.regexp#7EA6B8
constant.character.escape#7EA6B8
*url*, *link*, *uri*underline
text.html.markdown, punctuation.definition.list_item.markdown#D6D3C9
markup.table#D6D3C9
Coding Duck by mor10 - VS Code Theme