Skip to main content
Coding Theme

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#ffdbf5
  • activityBar.foreground#007554
  • button.background#007554
  • button.foreground#ffdbf5
  • checkbox.border#007554
  • debugIcon.breakpointForeground#ff7893
  • debugIcon.startForeground#ff7893
  • dropdown.background#d8f2eb
  • dropdown.border#9378ff
  • dropdown.foreground#9378ff
  • dropdown.listBackground#d8f2eb
  • editor.background#ffebed
  • editor.selectionBackground#ff80e390
  • editor.selectionHighlightBackground#ff789375
  • editor.wordHighlightBackground#ff789375
  • editorBracketMatch.background#3dffdc30
  • editorBracketMatch.border#ff80e3
  • editorCursor.background#ff0000
  • editorGroup.dropBackground#ff80e350
  • editorGroupHeader.tabsBackground#ebebf7
  • editorIndentGuide.activeBackground#00755490
  • editorIndentGuide.background#ff789398
  • editorInlayHint.background#ffdbf5
  • editorInlayHint.foreground#ffdbf5
  • editorInlayHint.parameterForeground#ebebf7
  • editorInlayHint.typeBackground#ffb19c
  • editorInlayHint.typeForeground#ffb19c
  • editorOverviewRuler.background#fff8ed
  • editorOverviewRuler.border#ff789380
  • editorOverviewRuler.bracketMatchForeground#00755490
  • editorOverviewRuler.findMatchForeground#ff789395
  • editorOverviewRuler.selectionHighlightForeground#ff80e395
  • editorOverviewRuler.warningForeground#f50a0a98
  • editorOverviewRuler.wordHighlightForeground#3dffdc85
  • editorOverviewRuler.wordHighlightStrongForeground#9a0fd685
  • input.background#ffdbf5
  • input.border#d10d99
  • input.foreground#9a0fd6
  • inputOption.activeBackground#ebebf7
  • inputOption.activeBorder#24a0e3
  • list.activeSelectionBackground#c9edff
  • list.activeSelectionForeground#ff7893
  • list.activeSelectionIconForeground#eedfc4
  • list.focusBackground#ffa8d1
  • list.focusOutline#13baba
  • list.hoverBackground#c9edff50
  • list.inactiveSelectionBackground#ff80e335
  • minimap.background#ffdbf5
  • minimap.selectionHighlight#ffebed
  • minimap.warningHighlight#ff0000
  • minimapSlider.activeBackground#9378ff90
  • minimapSlider.background#9378ff55
  • minimapSlider.hoverBackground#9378ff70
  • scrollbar.shadow#d8f2eb35
  • scrollbarSlider.activeBackground#9378ff85
  • scrollbarSlider.background#9378ff45
  • scrollbarSlider.hoverBackground#9378ff75
  • sideBar.background#fff8ed
  • sideBar.border#c9fffb
  • sideBar.foreground#13baba
  • sideBarSectionHeader.background#9378ff30
  • statusBar.background#b3dbff
  • statusBar.debuggingBackground#ff80e3
  • statusBar.foreground#9a0fd6
  • statusBar.noFolderBackground#d8f2eb
  • tab.inactiveBackground#ebebf7
  • textLink.activeForeground#b3dbff
  • titleBar.activeBackground#ffb8cf
  • titleBar.activeForeground#91000a
  • toolbar.activeBackground#febed3
  • toolbar.hoverBackground#febed3

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#ff80e3italic
variable.other.constant, meta.definition.variable, meta.var-single-variable.expr, meta.var.expr#f76fa5
comment.block.preprocessor#3dffdc
comment.documentation, comment.block.documentation#007554
invalid.illegal#c92053
keyword.operator#9a0fd6
keyword, storage#9a0fd6
storage.type, support.type#9a0fd6
constant.language, support.constant, variable.language#94b30c
variable, support.variable#c20c27
entity.name.type, entity.other.inherited-class, support.class#9378ffbold
constant.numeric, constant.character, constant#24a0e3
string#d97f09
source.python#d10d99
meta.block.cpp, meta.body.function.definition.cpp, meta.function.definition.cpp, source.cpp#d10d99
entity.name.namespace.cpp, meta.using-namespace.cpp#f50a0a
entity.name.variable.parameter.cs, source.cs#d10d99
meta.method.body.java, meta.method.java, meta.class.body.java, meta.class.java, source.java#d10d99
entity.name.function, support.function#13bababold
entity.name.exception#91000a
entity.name.sectionbold
constant.character.escape#abb2ed
string.regexp#4B83CD
constant.other.symbol#13baba
punctuation#000000
meta.tag.sgml.doctype, meta.tag.sgml.doctype string, meta.tag.sgml.doctype entity.name.tag, meta.tag.sgml punctuation.definition.tag.html#f50a0a
meta.tag, punctuation.definition.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html#13baba
entity.name.tag#d10d99
meta.tag entity.other.attribute-name, entity.other.attribute-name.html#24a0e3italic
constant.character.entity, punctuation.definition.entity#ff80e3
text.html.derivative#9a0fd6
meta.selector, meta.selector entity, meta.selector entity punctuation, entity.name.tag.css#9378ff
meta.property-name, support.type.property-name#d10d99
meta.property-value, meta.property-value constant.other, support.constant.property-value#13baba
keyword.other.importantbold
markup.changed#156d75
markup.deleted#156d75
markup.italicitalic
markup.error#91000a
markup.inserted#9a0fd6
meta.link#4B83CD
markup.output, markup.raw#9378ff
markup.prompt#9378ff
markup.heading#d10d99
markup.boldbold
markup.traceback#c20c27
markup.underlineunderline
markup.quote#c92053
markup.list#4B83CD
markup.bold, markup.italic#94b30c
markup.inline.raw#13baba
meta.diff.range, meta.diff.index, meta.separator#ff80e3
meta.diff.header.from-file#ff80e3
meta.diff.header.to-file#ff80e3
MillenialPinkTheme by Devin Robare - VS Code Theme