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#252525
  • activityBar.border#CFB53B
  • activityBar.foreground#CFB53B
  • activityBarBadge.background#9966ff
  • button.background#9966ff
  • button.foreground#e3e0cd
  • button.hoverBackground#CFB53B
  • editor.background#1e1a06
  • editor.foreground#e3e0cd
  • focusBorder#CFB53B
  • gitDecoration.addedResourceForeground#7ad9f5
  • gitDecoration.conflictingResourceForeground#9966ff
  • gitDecoration.deletedResourceForeground#e0115f
  • gitDecoration.modifiedResourceForeground#FFD700
  • gitDecoration.stageModifiedResourceForeground#cd7f32
  • list.activeSelectionBackground#1d1907
  • list.activeSelectionForeground#e3e0cd
  • progressBar.background#CFB53B
  • sideBar.background#1d1907
  • sideBar.border#CFB53B
  • sideBarTitle.foreground#e3e0cd
  • statusBar.background#252525
  • titleBar.activeBackground#252525

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
support.class.component#35ebd9
meta.tag, punctuation.terminator.statement.js#e7e3c9
source.vue entity.name.tag#44d374
source.vue entity.other.attribute-name.html#73ddfc
expression.embedded.vue, source.directive.vue#44d374
support.class.builtin.js#35ebd9
string.json#7c9399
source.json#e7e3c9
constant.language.json.comments#9966ff
meta.tag.xml#e7e3c9
entity.name.tag.xml, entity.other.attribute-name.xml, punctuation.definition.tag.xml#e7e3c9
entity.name.tag.localname.xml#ff3d8b
entity.other.attribute-name.localname.xml#73ddfc
meta.tag.metadata.doctype.html, punctuation.definition.entity.html, variable.control.import.include.pug, meta.tag.sgml.doctype.html#ec055c
entity.name.tag.html#ec055c
entity.other.attribute-name.html, entity.other.attribute-name.tag.pug#73ddfc
text.html.jinja#e7e3c9
comment.block.html#7c9399
constant.character.entity.named.nbsp.html#ec055c
string.quoted.pug#44d374
keyword.other, variable.interpolation.scss, support.constant.media#ec055cnormal
support.type.vendored.property-name.css#ec055c
meta.selector, meta.property-list.css, meta.at-rule.media.header, meta.definition.variable.css, punctuation.separator.list.comma.css, punctuation.separator.key-value.css, entity.other.keyframe-offset.css#ec055c
meta.selector, meta.property-list.scss, meta.at-rule.media.header, meta.definition.variable.scss, punctuation.separator.list.comma.scss, punctuation.separator.key-value.scss, entity.other.keyframe-offset.scss#ec055c
entity.name.tag#ec055c
entity.other.attribute-name.attribute#9966ff
entity.other.attribute-name.id#dbbd2f
entity.other.attribute-name.class#35ebd9
entity.other.attribute-name.pseudo-element, entity.other.attribute-name.pseudo-class#9966ff
support.type.property-name#73ddfc
support.constant.property-value.css#da7f25normal
keyword.other.unit#ff3d8b
variable.css, variable.argument.css#e7e3c9
variable.scss#ff3d8b
comment.line.scss#7c9399
meta.attribute-selector#44d374
punctuation.definition.attribute-selector.end.bracket.square.scss, punctuation.definition.attribute-selector.begin.bracket.square.scss#e7e3c9
support.function#ffd700
source.ignore, source.ini#ff3d8b
comment.line.number-sign.ignore, comment.line.number-sign.ini#ec055c
markup.inserted#73ddfc
markup.deleted#ff3d8b
markup.changed#9966ff
invalid#7c9399underline italic
invalid.deprecated#ec055cunderline italic
entity.name.filename#44d374
markup.error#ff3d8b
markup.underlineunderline
markup.bold#ec055cbold
markup.heading#ec055cbold
markup.italic#44d374italic
beginning.punctuation.definition.list.markdown, beginning.punctuation.definition.quote.markdown, punctuation.definition.link.restructuredtext#9966ff
markup.inline.raw, markup.raw.restructuredtext#73ddfc
markup.underline.link, markup.underline.link.image#35ebd9
meta.link.reference.def.restructuredtext, punctuation.definition.directive.restructuredtext, string.other.link.description, string.other.link.title#35ebd9
entity.name.directive.restructuredtext, markup.quote#35ebd9italic
meta.separator.markdown#73ddfc
fenced_code.block.language, markup.raw.inner.restructuredtext, markup.fenced_code.block.markdown punctuation.definition.markdown#ff3d8b
punctuation.definition.constant.restructuredtext#9966ff
markup.heading.markdown punctuation.definition.string.begin, markup.heading.markdown punctuation.definition.string.end#e7e3c9
meta.paragraph.markdown punctuation.definition.string.begin, meta.paragraph.markdown punctuation.definition.string.end#35ebd9
markup.quote.markdown meta.paragraph.markdown punctuation.definition.string.begin, markup.quote.markdown meta.paragraph.markdown punctuation.definition.string.end#e7e3c9
emphasisitalic
strongbold
header#dbbd2f
source#e7e3c9
meta.diff, meta.diff.header#9966ff
string.regexp, constant.other.character-class.set.regexp, constant.character.escape.backslash.regexp#44d374
punctuation.definition.group.capture.regexp#ec055c
string.regexp punctuation.definition.string.begin, string.regexp punctuation.definition.string.end#ff3d8b
constant.character.escape, constant.character.string.escape, constant.regexp#9966ff
punctuation.definition.character-class.regexp#35ebd9
punctuation.definition.group.regexp#dbbd2f
punctuation.definition.group.assertion.regexp, keyword.operator.negation.regexp#ff3d8b
meta.assertion.look-ahead.regexp#ffd700
entity.name.function.target.makefile, entity.name.section.toml, entity.name.tag.yaml, variable.other.key.toml#35ebd9
constant.other.date, constant.other.timestamp#dbbd2f
variable.other.alias.yaml#ffd700underline italic
constant.other.symbol.hashkey punctuation.definition.constant.ruby, entity.other.attribute-name.placeholder punctuation, entity.other.attribute-name.pseudo-class punctuation, entity.other.attribute-name.pseudo-element punctuation, meta.group.double.toml, meta.group.toml, meta.object-binding-pattern-variable punctuation.destructuring, punctuation.colon.graphql, punctuation.definition.block.scalar.folded.yaml, punctuation.definition.block.scalar.literal.yaml, punctuation.definition.block.sequence.item.yaml, punctuation.definition.entity.other.inherited-class, punctuation.function.swift, punctuation.separator.dictionary.key-value, punctuation.separator.hash, punctuation.separator.inheritance, punctuation.separator.key-value, punctuation.separator.key-value.mapping.yaml, punctuation.separator.namespace, punctuation.separator.pointer-access, punctuation.separator.slice, string.unquoted.heredoc punctuation.definition.string, support.other.chomping-indicator.yaml, punctuation.separator.annotation#ec055c
meta.string-contents.quoted.double punctuation.definition.variable, punctuation.definition.interpolation.begin, punctuation.definition.interpolation.end, punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.section.embedded.begin, punctuation.section.embedded.coffee, punctuation.section.embedded.end, punctuation.section.embedded.end source.php, punctuation.section.embedded.end source.ruby, punctuation.definition.variable.makefile#ec055c
storage.modifier#ec055c
storage, meta.implementation storage.type.objc, meta.interface-or-protocol storage.type.objc, source.groovy storage.type.def#ec055cregular
entity.name.type.class, entity.name.class#35ebd9normal
entity.other.inherited-class#35ebd9italic
keyword.expressions-and-types.swift, keyword.other.this, variable.language, variable.language punctuation.definition.variable.php, variable.other.readwrite.instance.ruby, variable.parameter.function.language.special#9966ffitalic
variable.object.property, meta.object-literal.key#73ddfc
entity.name.function.member, meta.tag.attributes, meta.function-call.generic, meta.function-call.object, meta.function-call.static, meta.method-call.java meta.method, meta.method.groovy, support.function.any-method.lua, keyword.operator.function.infix#4bee3b
entity.name.function#ffd700
entity.name.variable.parameter, meta.at-rule.function variable, meta.at-rule.mixin variable, meta.function.arguments variable.other.php, meta.function.parameter.no-default.php, meta.selectionset.graphql meta.arguments.graphql variable.arguments.graphql, variable.parameter#dbbd2fitalic
meta.decorator variable.other.readwrite, meta.decorator variable.other.property#9966ffitalic
meta.decorator variable.other.object#9966ff
keyword, punctuation.definition.keyword#ec055c
keyword.control.new, keyword.operator.new#ec055cbold
support#35ebd9italic
support.function, support.type.property-nameregular
support.function.magic, support.variable, variable.other.predefined#9966ffregular
entity.name.type, keyword.primitive-datatypes.swift, keyword.type.cs, meta.protocol-list.objc, meta.return-type.objc, source.go storage.type, source.groovy storage.type, source.java storage.type, source.powershell entity.other.attribute-name, storage.class.std.rust, storage.type.attribute.swift, storage.type.c, storage.type.core.rust, storage.type.cs, storage.type.groovy, storage.type.objc, storage.type.php, storage.type.haskell, storage.type.ocaml#35ebd9italic
entity.name.type.type-parameter, meta.indexer.mappedtype.declaration entity.name.type, meta.type.parameters entity.name.type#dbbd2f
keyword.operator.other.powershell, keyword.other.statement-separator.powershell, meta.brace.round, meta.function-call punctuation, punctuation.definition.arguments.begin, punctuation.definition.arguments.end, punctuation.definition.entity.begin, punctuation.definition.entity.end, punctuation.definition.tag.cs, punctuation.definition.type.begin, punctuation.definition.type.end, punctuation.section.scope.begin, punctuation.section.scope.end, storage.type.generic.java, string.template meta.brace, string.template punctuation.accessor#e7e3c9
comment#7c9399
string.quoted.double, string.quoted.single, string.template, punctuation.definition.string#44d374
string.quoted.docstring.multi, string.quoted.docstring.multi.python punctuation.definition.string.begin, string.quoted.docstring.multi.python punctuation.definition.string.end, string.quoted.docstring.multi.python constant.character.escape#9966ff
meta.definition.variable, meta.function variable.other.readwrite#e7e3c9
constant.other.key.perl, support.variable.property, variable.other.constant.js, variable.other.constant.ts, variable.other.constant.tsx#e7e3c9
variable.other.php#9966ff
constant, variable.other.constant#9966ff
meta.import variable.other.readwrite, meta.object-binding-pattern-variable variable.object.property, meta.variable.assignment.destructured.object.coffee variable#dbbd2fitalic
meta.import variable.other.readwrite.alias, meta.export variable.other.readwrite.alias, meta.variable.assignment.destructured.object.coffee variable variable#e7e3c9normal
meta.selectionset.graphql variable#44d374
meta.selectionset.graphql meta.arguments variable#dbbd2f
entity.name.fragment.graphql, variable.fragment.graphql#35ebd9
constant.other.symbol.hashkey.ruby, keyword.operator.dereference.java, keyword.operator.navigation.groovy, meta.scope.for-loop.shell punctuation.definition.string.begin, meta.scope.for-loop.shell punctuation.definition.string.end, meta.scope.for-loop.shell string, storage.modifier.import, punctuation.section.embedded.begin.tsx, punctuation.section.embedded.end.tsx, punctuation.section.embedded.begin.jsx, punctuation.section.embedded.end.jsx, punctuation.separator.list.comma.css, constant.language.empty-list.haskell#e7e3c9
source.shell variable.other#e7e3c9
meta.scope.prerequisites.makefile#44d374
meta.preprocessor.haskell#9966ff
Triage theme by Max Miliano - VS Code Theme