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#0c0a20
  • activityBar.foreground#7984d1
  • activityBarBadge.background#ff2e97
  • activityBarBadge.foreground#ffffff
  • button.background#1ea8fc
  • button.foreground#f2f3f7
  • button.hoverBackground#1ea8fc
  • descriptionForeground#f2f3f7
  • dropdown.background#100d2b
  • dropdown.listBackground#100d2b
  • editor.background#0c0a20
  • editor.findMatchBackground#484f7d
  • editor.findMatchHighlightBackground#484f7d80
  • editor.foreground#f2f3f7
  • editor.hoverHighlightBackground#42c6ff2a
  • editor.lineHighlightBackground#0c0a20
  • editor.selectionBackground#484f7d
  • editor.selectionHighlightBackground#484f7d8e
  • editor.wordHighlightBackground#ffffff22
  • editor.wordHighlightStrongBackground#42c6ff63
  • editorCursor.foreground#ff2e97
  • editorError.foreground#ff2e97
  • editorGroup.dropBackground#7984d1
  • editorGroupHeader.noTabsBackground#090819
  • editorGroupHeader.tabsBackground#090819
  • editorHoverWidget.background#100d2b
  • editorHoverWidget.border#3b4167
  • editorInfo.foreground#7984d1
  • editorLineNumber.activeForeground#42c6ff
  • editorLineNumber.foreground#484f7d
  • editorRuler.foreground#484f7d
  • editorSuggestWidget.background#100d2b
  • editorWarning.foreground#ff9b50
  • editorWidget.background#100d2b
  • editorWidget.border#3b4167
  • foreground#f2f3f7
  • gitDecoration.conflictingResourceForeground#df85ff
  • gitDecoration.deletedResourceForeground#ff2e97
  • gitDecoration.ignoredResourceForeground#7984d1
  • gitDecoration.modifiedResourceForeground#ffd400
  • gitDecoration.untrackedResourceForeground#42c6ff
  • input.background#0c0a20
  • input.border#763b8c
  • input.placeholderForeground#7984d1
  • inputOption.activeBorder#ff9b50
  • list.activeSelectionBackground#30007e
  • list.activeSelectionForeground#F2F3F7
  • list.dropBackground#100d2b
  • list.errorForeground#ff2e97
  • list.focusBackground#8a45a3
  • list.hoverBackground#0e0658
  • list.hoverForeground#F2F3F7
  • list.inactiveSelectionBackground#131033
  • list.warningForeground#ff2e97
  • menu.background#100d2b
  • panel.background#090819
  • panel.border#090819
  • panelTitle.activeBorder#1ea8fc
  • panelTitle.activeForeground#f2f3f7
  • panelTitle.inactiveForeground#7984d1
  • peekView.border#ff9b50
  • peekViewEditor.background#110d26
  • peekViewEditor.matchHighlightBackground#161130
  • peekViewEditor.matchHighlightBorder#161130
  • peekViewResult.background#0c0a20
  • peekViewResult.selectionBackground#ff9b50
  • peekViewTitle.background#0c0a20
  • peekViewTitleDescription.foreground#7984d1
  • progressBar.background#ff2e97
  • scrollbar.shadow#090819
  • scrollbarSlider.activeBackground#919ad9
  • scrollbarSlider.background#9199d94f
  • scrollbarSlider.hoverBackground#9199d9b4
  • sideBar.background#090819
  • sideBarSectionHeader.background#0c0a20
  • sideBarSectionHeader.foreground#7984d1
  • statusBar.background#090819
  • statusBar.foreground#7984d1
  • statusBar.noFolderBackground#1ea8fc
  • statusBar.noFolderForeground#ffffff
  • tab.activeBackground#0c0a20
  • tab.activeForeground#f2f3f7
  • tab.border#0c0a20
  • tab.inactiveBackground#090819
  • tab.inactiveForeground#7984d1
  • terminal.ansiBlack#283034
  • terminal.ansiBlue#42c6ff
  • terminal.ansiBrightBlack#435056
  • terminal.ansiBrightBlue#42c6ff
  • terminal.ansiBrightCyan#42c6ff
  • terminal.ansiBrightGreen#add0e5
  • terminal.ansiBrightMagenta#ff2afc
  • terminal.ansiBrightRed#ff2e97
  • terminal.ansiBrightWhite#f4f6f9
  • terminal.ansiBrightYellow#ffd400
  • terminal.ansiCyan#42c6ff
  • terminal.ansiGreen#62a9cf
  • terminal.ansiMagenta#ff2afc
  • terminal.ansiRed#ff2e97
  • terminal.ansiWhite#d9e0e9
  • terminal.ansiYellow#ffd400
  • terminal.background#090819
  • terminal.foreground#e4eeff
  • titleBar.activeBackground#090819

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, string.quoted.docstring.multi.python, string.quoted.docstring.multi.python punctuation.definition.string.begin.python, string.quoted.docstring.multi.python punctuation.definition.string.end.python#848bbditalic
string.quoted, string.template, punctuation.definition.string#8DFFB0
entity.name.type#FF957E
storage.type.function, punctuation.separator.annotation.result.python#36f9f6
meta.decorator variable.other, meta.decorator punctuation.decorator, storage.type.annotation, entity.name.annotation, meta.method.identifier.java, punctuation.definition.annotation#BA3C97
keyword.control#2EE2FA
keyword.operator#2EE2FA
entity.name.function, variable.function#4786FF
entity.name#fe4450
entity.name.namespace, keyword.other.import#72f1b8
constant#f97e72
string.regexp#f97e72
constant.other.color#f97e72
support.constant.font-name#f97e72
markup.underline.link#DD5500
string.other.link.description#f97e72
keyword.other.unit#f97e72
entity.other.inherited-class#DD5500
punctuation.separator.delimiter#FFFFFF
variable.language#F7768Ebold
storage.modifier#F7768E
storage.type#F7768E
constant.numeric#FF9E64
constant.language#f97e72
constant.character.escape#36f9f6
support.variable#ff7edb
punctuation.separator.key-value#b6b1b1
punctuation.section.embedded#fede5d
punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end#FF957E
markup.heading, entity.name.section#ff7edb
keyword.operator.assignment#2EE2FA
markup.quote#b6b1b1ccitalic
beginning.punctuation.definition.list#ff7edb
markup.underline.link.markdown, markup.inline.raw.string.markdown#72f1b8italic
string.other.link.title.markdown#fede5d
markup.heading.markdown, entity.name.section.markdown#ff7edbbold
markup.italic.markdown#2EE2FAitalic
markup.bold.markdown#2EE2FAbold
punctuation.definition.quote.begin.markdown, markup.quote.markdown#72f1b8
source.dart, source.python, source.scala#ff7edbff
keyword.operator.new, keyword.operator.expression, keyword.operator.logical#36f9f6
support#F7768E
support.function#36f9f6
punctuation.definition.tag#36f9f6
string.template meta.embedded.line#b6b1b1
variable#ff7edb
switch-block.expr.js#72f1b8
support.type.property-name.css, support.type.property-name.json#72f1b8
entity.other.attribute-name.id#36f9f6
entity.other.attribute-name.pseudo-element, entity.other.attribute-name.pseudo-class#36f9f6
support.function.misc.css#fe4450
constant.numeric.css#FF9E64bold
keyword.other.unit.px.css, keyword.other.unit.deg.css, keyword.other.unit.s.css, keyword.other.unit.percentage.css, keyword.other.unit.rem.css, keyword.other.unit.em.css, keyword.other.unit.vh.css, keyword.other.unit.vw.css, keyword.other.unit.ch.css, keyword.other.unit.cw.css#F7768Ebold
entity.other.keyframe-offset.css#36f9f6
variable.parameter.keyframe-list.css, constant.other.color.rgb-value.hex.css, punctuation.definition.constant.css#36f9f6
entity.other.attribute-name.css#fede5d
meta.object-literal.key, support.type.property-name#ff7edb
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, support.type.property-name.css, support.type.vendored.property-name, support.type.map.key#7aa2f7
support.constant.font-name, meta.definition.variable#8DFFB0
entity.other.attribute-name.class, meta.at-rule.mixin.scss entity.name.function.scss#8DFFB0
entity.other.attribute-name.id#fc7b7b
entity.name.tag.css#0db9d7
entity.other.attribute-name.pseudo-class punctuation.definition.entity, entity.other.attribute-name.pseudo-element punctuation.definition.entity, entity.other.attribute-name.class punctuation.definition.entity, entity.name.tag.reference#e0af68
meta.property-list#9abdf5
meta.property-list meta.at-rule.if, meta.at-rule.return variable.parameter.url, meta.property-list meta.at-rule.else#ff9e64
entity.other.attribute-name.parent-selector-suffix punctuation.definition.entity.css#73daca
meta.property-list meta.property-list#9abdf5
meta.at-rule.mixin keyword.control.at-rule.mixin, meta.at-rule.include entity.name.function.scss, meta.at-rule.include keyword.control.at-rule.include#bb9af7
keyword.control.at-rule.include punctuation.definition.keyword, keyword.control.at-rule.mixin punctuation.definition.keyword, meta.at-rule.include keyword.control.at-rule.include, keyword.control.at-rule.extend punctuation.definition.keyword, meta.at-rule.extend keyword.control.at-rule.extend, entity.other.attribute-name.placeholder.css punctuation.definition.entity.css, meta.at-rule.media keyword.control.at-rule.media, meta.at-rule.mixin keyword.control.at-rule.mixin, meta.at-rule.function keyword.control.at-rule.function, keyword.control punctuation.definition.keyword#9d7cd8
meta.property-list meta.at-rule.include#c0caf5
support.constant.property-value#ff9e64
source.json meta.structure.dictionary.json support.type.property-name.json#7aa2f7
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#0db9d7
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#7dcfff
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#bb9af7
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#e0af68
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#0db9d7
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#73daca
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#f7768e
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#9ece6a
punctuation.support.type.property-name.begin.json.comments, punctuation.support.type.property-name.end.json.comments, punctuation.separator.dictionary.key-value.json.comments#89DDFF
entity.name.tag, meta.tag.sgml#F7768E
punctuation.definition.tag.end, punctuation.definition.tag.begin, punctuation.definition.tag#BA3C97
entity.other.attribute-name.html#BB9AF7italic
meta.attribute.class.html#fe4450
string.quoted.double.html#8DFFB0
punctuation.definition.string.begin.html, punctuation.definition.string.end.html, punctuation.separator.key-value.html#89DDFF
text.html#9AA5CE
entity.name.function.python#36f9f6
entity.name.function.decorator.python#179FFF
variable.parameter.function-call.python#72f1b8
variable.parameter.function.language.special.self.python#f97e72
storage.type.function.python#72f1b8
punctuation.separator.colon.python, punctuation.section.function.begin.python, punctuation.separator.dict.python, punctuation.separator.arguments.python, punctuation.separator.period.python, punctuation.separator.element.python, punctuation.separator.parameters.python, punctuation.section.class.begin.python, punctuation.separator.annotation.python#ffffff
variable.other.constant.property.js, variable.other.property.js#C0CAF5
keyword.control.export.js, keyword.control.import.js#72f1b8
keyword.control.java#36F9F6
storage.type.primitive.java#F7768E
GatomontesRoseIII by GatomontesRoseIII - VS Code Theme