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#f5f3f0
  • activityBarBadge.background#2255aa
  • editor.background#faf8f5
  • editor.foreground#2d2a26
  • editor.lineHighlightBackground#f0ede8
  • editor.selectionBackground#d4e5ff
  • editorBracketHighlight.foreground1#cc6622
  • editorBracketHighlight.foreground2#2266aa
  • editorBracketHighlight.foreground3#884488
  • editorBracketHighlight.foreground4#228855
  • editorBracketHighlight.foreground5#cc4422
  • editorBracketHighlight.foreground6#5544aa
  • editorBracketHighlight.unexpectedBracket.foreground#cc2222
  • editorBracketMatch.background#d4e5ff
  • editorBracketMatch.border#2266aa
  • editorCursor.foreground#2255aa
  • editorIndentGuide.activeBackground1#c0bdb8
  • editorIndentGuide.background1#e0ddd8
  • editorLineNumber.activeForeground#606060
  • editorLineNumber.foreground#a0a0a0
  • editorRuler.foreground#e0ddd8
  • sideBar.background#f5f3f0
  • sideBarTitle.foreground#606060
  • statusBar.background#f5f3f0
  • tab.activeBackground#faf8f5
  • tab.inactiveBackground#f5f3f0
  • titleBar.activeBackground#f5f3f0

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#887799italic
keyword, storage.type, storage, storage.modifier#cc6622
keyword.control, keyword.control.loop, keyword.control.conditional, keyword.control.flow, keyword.control.import, keyword.control.export, keyword.control.trycatch, keyword.control.exception#2255aa
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#bb5533
string, string.quoted, string.quoted.double, string.quoted.single, string.quoted.other, string.quoted.triple, string.template, meta.embedded.assembly#228855
string.regexp, source.regexp, constant.regexp, string.regexp.character-class, string.regexp.arbitrary-repitition#228855
constant.character.escape, string.regexp constant.character.escape#3a9a68bold
punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.section.embedded, punctuation.section.embedded.begin, punctuation.section.embedded.end#cc6622
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#996622
constant.language, variable.language#5544aaitalic
constant.language.boolean#5544aaitalic
entity.name.type, support.type.builtin, support.type.primitive#227799
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#227799
support.type.nominal#884488italic
support.type.comptime#775522italic
entity.name.type.parameter, support.type.parameter#227799italic
entity.name.function, support.function, entity.name.operator.custom-literal, support.constant.handlebars#338833
variable, variable.other, meta.definition.variable.name, entity.name.variable#335588
variable.other.constant, variable.other.enummember, entity.name.constant#224477bold
variable.parameter, variable.parameter.function#2266aaitalic
variable.parameter.output#cc4422italic bold
variable.other.global#aa4466
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#335588
entity.name.tag, support.class.component#228855
punctuation.definition.tag, punctuation.definition.tag.begin, punctuation.definition.tag.end#667788
entity.other.attribute-name, entity.name.decorator, meta.decorator, entity.name.function.decorator#995566
punctuation.accessor, punctuation.accessor.property, punctuation.accessor.tuple, punctuation.separator.dot-access#556677
punctuation.bracket, keyword.operator.bracket, punctuation.definition.block, punctuation.definition.parameters, punctuation.definition.arguments#667788
punctuation.accessor.pointer#2277aa
punctuation.accessor.typepun#996622
punctuation.separator, punctuation.separator.comma, punctuation.terminator, punctuation.terminator.statement#667788
invalid, invalid.illegal#cc2222
invalid.deprecated#cc2222italic
support, support.constant, support.other#335588
meta.embedded, source.groovy.embedded, meta.template.expression#2d2a26
entity.name.label#2d2a26
meta.preprocessor, entity.name.function.preprocessor, keyword.control.directive#cc6622
constant.other.reference.link, string.other.link#228855
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#2255aabold
punctuation.definition.heading.markdown#3366aa
markup.bold, markup.bold.markdown#cc6622bold
markup.italic, markup.italic.markdown#884488italic
markup.bold markup.italic, markup.italic markup.bold#995577bold italic
markup.underline#228855underline
markup.strikethrough, markup.strikethrough.markdown#909090strikethrough
markup.underline.link, markup.underline.link.markdown, markup.underline.link.image.markdown, string.other.link.description.markdown#228855
string.other.link.title.markdown#2266aa
markup.inline.raw, markup.inline.raw.string.markdown, markup.raw.inline.markdown#996622
markup.fenced_code.block.markdown, markup.raw.block.markdown#2d2a26
fenced_code.block.language.markdown#227799
markup.quote, markup.quote.markdown, punctuation.definition.quote.begin.markdown#887799italic
punctuation.definition.list.begin.markdown, beginning.punctuation.definition.list.markdown#bb5533
meta.separator, meta.separator.markdown#c0bdb8
markup.inserted, meta.diff.header.to-file, punctuation.definition.inserted#228855
markup.deleted, meta.diff.header.from-file, punctuation.definition.deleted#cc2222
markup.changed, punctuation.definition.changed#996622
meta.diff.range#884488bold
meta.diff.header#2255aa
support.type.property-name.json, support.type.property-name.json.comments#228855
support.type.property-name.css, support.type.property-name.less, support.type.property-name.scss#335588
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#996622
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#228855
Inkglow Themes by Tim Caswell - VS Code Theme