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#0f0f23
  • activityBarBadge.background#7fdfff
  • button.hoverBackground#1a1a2e
  • dropdown.background#0f0f23
  • editor.background#0f0f23
  • editor.foreground#e0e6ed
  • editor.lineHighlightBackground#1a1a2e
  • editor.selectionBackground#ff008055
  • editor.selectionHighlightBackground#ff008022
  • editorCursor.foreground#ff0080
  • editorGroupHeader.tabsBackground#0f0f23
  • editorSuggestWidget.background#0f0f23
  • editorSuggestWidget.border#19243a
  • editorSuggestWidget.foreground#e0e6ed
  • editorSuggestWidget.highlightForeground#7fdfff
  • editorSuggestWidget.selectedBackground#1a1a2e
  • editorWidget.background#0f0f23
  • editorWidget.foreground#e0e6ed
  • input.background#0a0a0f
  • input.foreground#e0e6ed
  • list.activeSelectionBackground#19243a
  • list.hoverBackground#1a1a2e
  • list.inactiveSelectionBackground#0a0a0f
  • menu.background#0f0f23
  • panel.background#0f0f23
  • pickerGroup.border#19243a
  • pickerGroup.foreground#00eaff
  • quickInput.background#0f0f23
  • quickInput.foreground#e0e6ed
  • scrollbarSlider.activeBackground#19243a
  • scrollbarSlider.background#1a1a2e
  • scrollbarSlider.hoverBackground#ff008022
  • sideBar.background#0f0f23
  • sideBar.foreground#e0e6ed
  • sideBarTitle.foreground#b2ccd6
  • statusBar.background#0f0f23
  • statusBar.border#000000
  • statusBar.debuggingBackground#ff0040
  • statusBar.foreground#7fdfff
  • statusBar.noFolderBackground#0f0f23
  • tab.activeBackground#0f0f23
  • tab.inactiveBackground#0f0f23
  • tab.unfocusedActiveBackground#0f0f23
  • tab.unfocusedInactiveBackground#0f0f23
  • terminal.ansiBrightBlue#0080ff
  • terminal.ansiBrightCyan#b2f7ef
  • terminal.ansiBrightGreen#aee6e6
  • terminal.ansiBrightMagenta#ff0080
  • terminal.ansiBrightRed#ff0040
  • terminal.ansiBrightWhite#ffffff
  • terminal.background#0f0f23
  • terminal.foreground#7fdfff
  • terminalCursor.background#ff0080
  • terminalCursor.foreground#ff0080
  • titleBar.activeBackground#0f0f23
  • titleBar.inactiveBackground#0f0f23

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#a0aab8italic
variable, identifier#7fdfff
constant.other.color#ffffff
invalid, invalid.illegal#ff0040
keyword, storage.type, storage.modifier#ff0080bold
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#b2f7ef
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#7ba7d9
function, entity.name.function#4FC3F7
meta.block variable.other#aee6e6
support.other.variable, string.other.link#aee6e6
number, constant.numeric#B2FF59
string, constant.other.symbol#F06292
type, entity.name.type, class, entity.name.class#0080ff
support.type#b2f7ef
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#b2f7ef
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#aee6e6
variable.language#aee6e6italic
entity.name.method.js#ff8000italic
meta.class-method.js entity.name.function.js, variable.function.constructor#ff8000
entity.other.attribute-name#F06292
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name#ffb366italic
string.quoted.double.html, string.quoted.single.html, string.quoted.other.html#a8e6cf
entity.other.attribute-name.class#ff8000
source.sass keyword.control#0080ff
markup.inserted#b2ccd6
markup.deleted#ff0040
markup.changed#ff00ff
string.regexp#b2f7ef
constant.character.escape#b2f7ef
*url*, *link*, *uri*underline
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js#0080ffitalic
source.js constant.other.object.key.js string.unquoted.label.js#ff0040italic
source.json meta.structure.dictionary.json support.type.property-name.json#ff00ff
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#ff8000
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#ff4080
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#ff0040
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#ff8000
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#0080ff
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#ff4080
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#ff00ff
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#00ff40
text.html.markdown, punctuation.definition.list_item.markdown#7fdfff
text.html.markdown markup.inline.raw.markdown#ff00ff
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown#0080ff
markdown.heading, markup.heading | markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown#00ff40
markup.italic#ff4080italic
markup.bold, markup.bold string#ff4080bold
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#ff4080bold
markup.underline#ff8000underline
markup.quote punctuation.definition.blockquote.markdown#0080ff
markup.quoteitalic
string.other.link.title.markdown#0080ff
string.other.link.description.title.markdown#ff00ff
constant.other.reference.link.markdown#ff8000
markup.raw.block#ff00ff
markup.raw.block.fenced.markdown#00000050
punctuation.definition.fenced.markdown#00000050
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end#7fdfff
variable.language.fenced.markdown#0080ff
meta.separator#0080ffbold
markup.table#7fdfff
entity.name.tag.css, entity.other.attribute-name.class.css, entity.other.attribute-name.id.css#ff0080bold
support.type.property-name.css, support.type.property-name.sass, support.type.property-name.scss, support.type.property-name.less, support.type.property-name.stylus, support.type.property-name.postcss#00eaff
support.constant.property-value.css#0080ff
entity.name.function, support.function, meta.function-call#2bb3b3bold
constant.numeric, number#bfcfff
entity.name.type, support.type#66b3ff
keyword, storage.type, storage.modifier#ff66b3bold
string, constant.other.symbol#f0ff66
variable, identifier#b3e6ff
class, entity.name.class#66b3ff
entity.name.tag.css, entity.other.attribute-name.class.css, entity.other.attribute-name.id.css#ff66b3bold
support.type.property-name.css, support.type.property-name.sass, support.type.property-name.scss, support.type.property-name.less, support.type.property-name.stylus, support.type.property-name.postcss#66e6ff
support.constant.property-value.css#66b3ff
meta.object-literal.key, meta.object-literal.key.ts#ffb366
support.class.console, variable.language.console, entity.name.function.console, support.function.console, variable.other.console#8a7bb8
variable.parameter, meta.function.parameters variable, meta.parameters variable, variable.parameter.function, variable.parameter.js, variable.parameter.ts, meta.function.parameter.js, meta.function.parameter.ts, meta.lambda.parameters variable, meta.function.argument, meta.function.arguments variable, meta.method.parameters variable, meta.class.method.parameters variable#F8BBD0
Nebula Rose Themes by Codetown - VS Code Theme