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.activeBackground#6cfb91
  • activityBar.background#070A08
  • activityBar.dropBackground#0BD6BB
  • activityBar.foreground#04962a
  • activityBarBadge.background#ffffff
  • activityBarBadge.foreground#4B5757
  • button.background#747573
  • button.foreground#9ae38d
  • checkbox.background#747573
  • checkbox.foreground#0af847
  • editor.background#090A09
  • editor.foreground#7cfb9d
  • editor.inactiveSelectionBackground#79BD8F
  • editor.selectionBackground#3C7A4D
  • editor.selectionForeground#ffffff
  • editorGroupHeader.noTabsBackground#212424
  • editorGroupHeader.tabsBackground#21231F
  • editorLineNumber.foreground#506A3C
  • input.background#1e211d
  • input.foreground#fff
  • input.placeholderForeground#eee
  • inputOption.activeBackground#2b7006
  • inputValidation.errorBackground#E4A3B8
  • inputValidation.errorBorder#7D1D4E
  • inputValidation.errorForeground#7D1D4E
  • inputValidation.infoBackground#71d5ff
  • inputValidation.infoBorder#075a7e
  • inputValidation.infoForeground#075a7e
  • inputValidation.warningBackground#fc9e8e
  • inputValidation.warningBorder#882412
  • inputValidation.warningForeground#882412
  • menu.background#1ADB68
  • minimap.background#191D1A
  • notificationCenterHeader.background#0af847
  • notificationCenterHeader.foreground#0d0d0d
  • notifications.background#0d0d0d
  • notifications.foreground#D5CCED
  • notificationsErrorIcon.foreground#D5CCED
  • notificationsInfoIcon.foreground#D5CCED
  • notificationsWarningIcon.foreground#D5CCED
  • progressBar.background#1ADB68
  • quickInput.background#4c574b
  • quickInput.foreground#FFD9FE
  • sideBar.background#131413
  • sideBar.dropBackground#333B3B
  • sideBar.foreground#A2BABA
  • sideBarSectionHeader.background#272d29
  • sideBarSectionHeader.foreground#6d7f72
  • sideBarTitle.foreground#7cfb9d
  • statusBar.background#070A08
  • statusBar.debuggingBackground#2b332a
  • statusBar.foreground#7cfb9d
  • statusBar.noFolderBackground#2b332a
  • statusBar.noFolderBorder#2b332a
  • statusBar.noFolderForeground#98e082
  • statusBarItem.activeBackground#2b332a
  • tab.activeBackground#090A09
  • tab.activeBorderTop#7cfb9d
  • tab.activeForeground#D9F4CF
  • tab.hoverBorder#7cfb9d
  • tab.inactiveBackground#292D29
  • tab.unfocusedActiveBackground#502EF0
  • terminal.ansiBlack#0b0c0b
  • terminal.ansiBlue#3dcdcd
  • terminal.ansiBrightBlack#040404
  • terminal.ansiBrightBlue#24ebeb
  • terminal.ansiBrightCyan#1ce474
  • terminal.ansiBrightGreen#73f21a
  • terminal.ansiBrightMagenta#d476f2
  • terminal.ansiBrightRed#f80a73
  • terminal.ansiBrightWhite#c3deb0
  • terminal.ansiBrightYellow#c3f50b
  • terminal.ansiCyan#35d27a
  • terminal.ansiGreen#78e02f
  • terminal.ansiMagenta#b953d9
  • terminal.ansiRed#de186f
  • terminal.ansiWhite#9ab28a
  • terminal.ansiYellow#b6e02f
  • terminal.background#1b1d1a
  • terminal.foreground#c0d9b4
  • terminalCursor.background#69FF00
  • terminalCursor.foreground#69FF00
  • textLink.activeForeground#adfdc2
  • textLink.foreground#6cfb91
  • titleBar.activeBackground#090A09

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#4F634Fitalic
variable, string constant.other.placeholder#D5FFB3
constant.other.color#CCE4BE
invalid, invalid.illegal#FF4973
keyword, storage.type, storage.modifier#6FE63Cbold
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#D2FA9F
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#9FFD68
entity.name.function, meta.function-call, variable.function, support.function, keyword.other.special-method#D6FA22italic bold
meta.block variable.other#F7DB3B
support.other.variable, string.other.link#F7BB59
constant.numeric, constant.language, support.constant, constant.character, constant.escape, variable.parameter, keyword.other.unit, keyword.other#FDA817
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#E2FFE1italic
entity.name, support.type, support.class, support.orther.namespace.use.php, meta.use.php, support.other.namespace.php, markup.changed.git_gutter, support.type.sys-types#FF9B5F
support.type#A3DA9F
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#EBF0A3
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#DAFF5C
variable.language#DAFF5Citalic
entity.name.method.js#7BFF8Citalic
meta.class-method.js entity.name.function.js, variable.function.constructor#4EFF74bold
entity.other.attribute-name#EEC49D
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name#ABFF5Eitalic
entity.other.attribute-name.class#C1F01F
source.sass keyword.control#C1F01F
markup.inserted#C3E88D
markup.deleted#FF5370
markup.changed#C792EA
string.regexp#FFEA95
constant.character.escape#A4FF8B
*url*, *link*, *uri*underline
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js#73FF8Ditalic
source.json meta.structure.dictionary.json support.type.property-name.json#5AFAA2
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#1C7BE6
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#FFB25E
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#E952FF
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#23D14C
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#8245FF
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#FF92F2
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#EB4046
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#A2FF4D
text.html.markdown, punctuation.definition.list_item.markdown#EEFFFF
text.html.markdown markup.inline.raw.markdown#EBBE8F
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown#65737E
markdown.heading, markup.heading | markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown#C3E88D
markup.italic#D7FDA7italic
markup.bold, markup.bold string#D7FDA7bold
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#D7FDA7bold
markup.underline#D7FDA7underline
markup.quote punctuation.definition.blockquote.markdown#558355
markup.quoteitalic
string.other.link.title.markdown#72FF8B
string.other.link.description.title.markdown#8FEBCD
constant.other.reference.link.markdown#FFCB6B
markup.raw.block#C792EA
markup.raw.block.fenced.markdown#00000050
punctuation.definition.fenced.markdown#00000050
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end#EEFFFF
variable.language.fenced.markdown#65737E
meta.separator#65737Ebold