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#050508
  • activityBarBadge.background#3b5dc9
  • editor.background#080810
  • editor.foreground#f4f4f4
  • editor.lineHighlightBackground#101320
  • editor.selectionBackground#3b5dc9
  • editorBracketHighlight.foreground1#ef7d57
  • editorBracketHighlight.foreground2#41a6f6
  • editorBracketHighlight.foreground3#a7f070
  • editorBracketHighlight.foreground4#ffcd75
  • editorBracketHighlight.foreground5#73eff7
  • editorBracketHighlight.foreground6#38b764
  • editorBracketHighlight.unexpectedBracket.foreground#b13e53
  • editorBracketMatch.background#29366f
  • editorBracketMatch.border#41a6f6
  • editorCursor.foreground#41a6f6
  • editorIndentGuide.activeBackground1#566c86
  • editorIndentGuide.background1#333c57
  • editorLineNumber.activeForeground#94b0c2
  • editorLineNumber.foreground#566c86
  • editorRuler.foreground#333c57
  • sideBar.background#050508
  • sideBarTitle.foreground#94b0c2
  • statusBar.background#050508
  • tab.activeBackground#080810
  • tab.inactiveBackground#050508
  • titleBar.activeBackground#050508

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, comment.line, comment.line.double-slash, comment.line.number-sign, comment.line.semicolon, comment.block, comment.block.documentation, punctuation.definition.comment, string.comment#566c86italic
keyword, storage.type, storage, storage.modifier#ef7d57
keyword.control, keyword.control.loop, keyword.control.conditional, keyword.control.flow, keyword.control.import, keyword.control.export, keyword.control.trycatch, keyword.control.exception#41a6f6
keyword.operator, keyword.operator.arrow, keyword.operator.assignment, keyword.operator.comparison, keyword.operator.logical, keyword.operator.arithmetic, keyword.operator.bitwise, keyword.operator.ternary, keyword.operator.spread, keyword.operator.rest, keyword.operator.typeof, keyword.operator.instanceof, keyword.operator.expression, keyword.operator.new, keyword.operator.delete, keyword.operator.cast, keyword.operator.sizeof, keyword.operator.alignof, keyword.operator.wordlike#b13e53
string, string.quoted, string.quoted.double, string.quoted.single, string.quoted.other, string.quoted.triple, string.template, meta.embedded.assembly#38b764
string.regexp, source.regexp, constant.regexp, string.regexp.character-class, string.regexp.arbitrary-repitition#38b764
constant.character.escape, string.regexp constant.character.escape#60c888bold
punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.section.embedded, punctuation.section.embedded.begin, punctuation.section.embedded.end#ef7d57
constant.numeric, constant.numeric.decimal, constant.numeric.integer, constant.numeric.float, constant.numeric.hex, constant.numeric.binary, constant.numeric.octal, constant.numeric.dozenal, keyword.other.unit#ffcd75
constant.language, variable.language#c04870italic
constant.language.boolean#e06080italic
entity.name.type, support.type.builtin, support.type.primitive#73eff7
support.type, entity.name.type.class, entity.name.type.struct, entity.name.type.enum, entity.name.type.interface, entity.name.type.alias, entity.name.type.module, entity.name.namespace, entity.other.inherited-class, support.class#73eff7
support.type.nominal#73eff7italic
support.type.comptime#ffcd75italic
entity.name.type.parameter, support.type.parameter#73eff7italic
entity.name.function, support.function, entity.name.operator.custom-literal, support.constant.handlebars#a7f070
variable, variable.other, meta.definition.variable.name, entity.name.variable#94b0c2
variable.other.constant, variable.other.enummember, entity.name.constant#94b0c2bold
variable.parameter, variable.parameter.function#41a6f6italic
variable.parameter.output#ef7d57italic bold
variable.other.global#b13e53
variable.other.property, variable.other.object.property, support.variable, meta.object-literal.key, meta.property-name, support.type.vendored.property-name, support.type.property-name#94b0c2
entity.name.tag, support.class.component#38b764
punctuation.definition.tag, punctuation.definition.tag.begin, punctuation.definition.tag.end#566c86
entity.other.attribute-name, entity.name.decorator, meta.decorator, entity.name.function.decorator#5d275d
punctuation.accessor, punctuation.accessor.property, punctuation.accessor.tuple, punctuation.separator.dot-access#94b0c2
punctuation.bracket, keyword.operator.bracket, punctuation.definition.block, punctuation.definition.parameters, punctuation.definition.arguments#566c86
punctuation.accessor.pointer#73eff7
punctuation.accessor.typepun#ffcd75
punctuation.separator, punctuation.separator.comma, punctuation.terminator, punctuation.terminator.statement#566c86
invalid, invalid.illegal#b13e53
invalid.deprecated#b13e53italic
support, support.constant, support.other#94b0c2
meta.embedded, source.groovy.embedded, meta.template.expression#f4f4f4
entity.name.label#f4f4f4
meta.preprocessor, entity.name.function.preprocessor, keyword.control.directive#ef7d57
constant.other.reference.link, string.other.link#38b764
markup.heading, heading.1.markdown, heading.2.markdown, heading.3.markdown, heading.4.markdown, heading.5.markdown, heading.6.markdown, entity.name.section, entity.name.section.markdown, markup.heading entity.name#41a6f6bold
punctuation.definition.heading.markdown#3b5dc9
markup.bold, markup.bold.markdown#ef7d57bold
markup.italic, markup.italic.markdown#94b0c2italic
markup.bold markup.italic, markup.italic markup.bold#b13e53bold italic
markup.underline#38b764underline
markup.strikethrough, markup.strikethrough.markdown#566c86strikethrough
markup.underline.link, markup.underline.link.markdown, markup.underline.link.image.markdown, string.other.link.description.markdown#38b764
string.other.link.title.markdown#41a6f6
markup.inline.raw, markup.inline.raw.string.markdown, markup.raw.inline.markdown#ffcd75
markup.fenced_code.block.markdown, markup.raw.block.markdown#f4f4f4
fenced_code.block.language.markdown#73eff7
markup.quote, markup.quote.markdown, punctuation.definition.quote.begin.markdown#566c86italic
punctuation.definition.list.begin.markdown, beginning.punctuation.definition.list.markdown#b13e53
meta.separator, meta.separator.markdown#333c57
markup.inserted, meta.diff.header.to-file, punctuation.definition.inserted#38b764
markup.deleted, meta.diff.header.from-file, punctuation.definition.deleted#b13e53
markup.changed, punctuation.definition.changed#ffcd75
meta.diff.range#a7f070bold
meta.diff.header#41a6f6
support.type.property-name.json, support.type.property-name.json.comments#38b764
support.type.property-name.css, support.type.property-name.less, support.type.property-name.scss#94b0c2
entity.other.attribute-name.class.css, entity.other.attribute-name.id.css, entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.pseudo-element.css, entity.other.attribute-name.scss, entity.name.tag.css, entity.name.tag.less#ffcd75
support.constant.property-value, support.constant.color, support.constant.font-name, support.constant.media-type, support.constant.media, constant.other.color.rgb-value, constant.other.rgb-value#38b764