Skip to main content
CodingTheme

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.

  • diffEditor.insertedTextBackground#0e9e4024
  • diffEditor.removedTextBackground#d4001a24
  • editor.background#1f1d1dff
  • editor.findMatchBackground#602e6aff
  • editor.findMatchHighlightBackground#0a6224ff
  • editor.findRangeHighlightBackground#01030344
  • editor.foreground#b5b1a5ff
  • editor.lineHighlightBackground#222221ff
  • editor.selectionBackground#17476fff
  • editor.wordHighlightBackground#7ca6bc40
  • editor.wordHighlightStrongBackground#e353ff5c
  • editorBracketMatch.background#13282eff
  • editorBracketMatch.border#49a3b9ff
  • editorCursor.foreground#ffffff90
  • editorError.foreground#e22230ff
  • editorIndentGuide.background#5c7c7848
  • editorLineNumber.foreground#6c8a8680
  • editorRuler.foreground#78607060
  • editorWarning.foreground#0fbf5aff
  • editorWhitespace.foreground#65878448

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment#3d9177ffitalic
string, constant.character#cc7c5eff
punctuation.definition.string#d17457ff
constant.character.escape, constant.character punctuation.definition#d0544aff
string.regexp, string.regexp.js, string.regexp.ts, constant.other.character-class.set.regexp#c35a0eff
constant.numeric#e3c53fff
constant.language#e3c53fff
support.constant, constant.other#b5b1a5ff
meta.brace, punctuation#9a8c9cff
keyword.operator#b0a1b1ff
keyword.operator.bitwise.js, keyword.operator.bitwise.ts#9a8cfcff
keyword, variable.language#cb81b5ff
keyword.operator.expression#569bc1ff
storage, keyword.operator.new, keyword.operator.delete#569bc1ff
variable#b5b1a5ff
variable.parameter#cead62ffitalic
punctuation.definition.typeparameters.begin, punctuation.definition.typeparameters.end#b49eb7ffitalic
meta.type.annotation.ts, keyword.operator.type.annotation.tsitalic
support.other.variable, support.variable#b5b1a5ff
entity.name.function, support.function#b5b1a5ff
variable.other.property, variable.other.object.property, support.variable.property#b5b1a5ff
entity.name.class, entity.name.type, support.type, support.type.primitive, entity.other.inherited-class, support.type, support.class#5fb2c3ffitalic
meta.object-literal.key, meta.object-literal.key string.quoted, meta.object-literal.key punctuation.definition.string, meta.object-literal.key entity.name.function, support.type.property-name, punctuation.support.type.property-name#5fb2c3ff
entity.other.attribute-name#5fb2c3ffitalic
entity.name.tag#cb81b5ff
string.unquoted.html, string.quoted.single.html, string.quoted.double.html, string.unquoted.xml, string.quoted.single.xml, string.quoted.double.xml, string.quoted.double.json, support.constant.property-value, meta.property-value.css#cc7c5eff
punctuation.definition.string.begin.html, punctuation.definition.string.end.html, punctuation.definition.string.begin.xml, punctuation.definition.string.end.xml, punctuation.definition.string.begin.json, punctuation.definition.string.end.json#d17457ff
variable.other.normal.shell, punctuation.definition.variable.shell, variable.other.special.shell, variable.other.positional.shell, string.other.math.shell punctuation.definition.string.begin.shell, string.other.math.shell punctuation.definition.string.end.shell#8eb240ff
string.interpolated, string.interpolated punctuation.definition.string.begin.shell, string.interpolated punctuation.definition.string.end.shell#8d8dfbff
comment.line.shebang, comment.line.shebang punctuation.definition.comment.line.shebang#8d8dfbff
entity.name.function.target.makefile#5fb2c3ff
meta.scope.prerequisites.makefile
variable.other.makefile, punctuation.definition.variable.makefile#8eb240ff
markup.heading.markdown, punctuation.definition.heading.markdown, markup.heading.setext#4b9eccffbold
punctuation.definition.markdown, beginning.punctuation.definition.list.markdown, meta.separator.markdown#8eb240ff
markup.italic.markdownitalic
markup.bold.markdown#bdb9aeffbold
markup.italic.markdown markup.bold.markdown, markup.bold.markdown markup.italic.markdown#bdb9aeffitalic bold
markup.inline.raw.markdown, punctuation.definition.raw.markdown#8eb240ff
punctuation.definition.markdown markup.fenced_code.block.markdown, fenced_code.block.language#8eb240ff
markup.underline.link.image.markdown, markup.underline.link.markdown#cb81b5ff
meta.link.reference.def.markdown constant.other.reference.link.markdown, meta.link.reference.def.markdown punctuation.definition.constant.markdown#cc7c5eff
markup.quote.markdown#5fb2c3ff
meta.separator.markdown#4b9eccff
invalid#b5b1a5ff
invalid.deprecated#b5b1a5ff

Shiki preview

TypeScript sample highlighted with this variant's colors and tokenColors.

Loading...

Luna Theme by Kalman Keri - VS Code Theme