Skip to main content
Coding Theme

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.

  • editor.background#ffffff
  • editor.findMatchBackground#b0c5e3cc
  • editor.findMatchHighlightBackground#ffb442cc
  • editor.foreground#000000
  • editor.lineHighlightBackground#e9eff8
  • editor.selectionBackground#b0c5e3
  • editor.wordHighlightBackground#eceba3cc
  • editorCursor.foreground#000000
  • editorIndentGuide.background#D3D3D3
  • editorLineNumber.foreground#000000
  • editorWhitespace.foreground#ffffff
  • peekViewResult.matchHighlightBackground#ffb442cc

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
#000000ff
entity.name.type.class, entity.name.type.interface#000000bold
entity.other.inherited-class#000000
entity.name.function,meta.definition.method.ts entity.name.function.ts#000000bold
constant.other#009900italic
comment,comment.block.documentation.js,comment.line.double-slash.js,entity.name.type.instance.jsdoc,variable.other.jsdoc#969696
storage.type.class.jsdoc,keyword.other.documentation#969696bold
string.regexp.js#9933CC
keyword,storage,constant.language,entity.name.tag,punctuation.definition.tagstorage.type.function.js,storage.type.js,variable.language.this,variable.language.java,variable.language.super.ts,keyword.control,keyword.operator.new,keyword.operator.expression.typeof.js,keyword.operator.expression.delete.js,keyword.operator.expression.instanceof.js,keyword.other.import,keyword.other.import.static,keyword.other.package,support.type.primitive.ts#0000E6
support.type.property-name.json,entity.other.attribute-name,meta.object-literal.key,variable.other.property,variable.other.object.property,variable.other.constant.property.js,variable.other.constant.object.property.js,support.variable.property.dom.js,variable.object.property#009900
string,punctuation.definition.string.begin.js,punctuation.definition.string.end.js,string.quoted.single.js,string.quoted.double.js#CE7B00
punctation,punctuation.terminator.statement.js,punctuation.separator.key-value.js,punctuation.separator.comma.js,punctuation.definition.block.js,punctuation.accessor.js,punctuation.definition.parameters.begin.js,punctuation.definition.parameters.end.js#000000
support.variable.dom.ts#9F0D79
keyword.operator,storage.type.function.arrow#000000
variable,meta.function-call.ts entity.name.function.ts,meta.function-call.js entity.name.function.js,support.function,support.variable.property.js,storage.modifier.import,storage.modifier.package,storage.type.annotation,storage.type.generic,storage.type.object.array,storage.type.java#000000plain
support.class.js#000000
meta.tag.sgml.doctype.html,meta.tag.sgml.doctype.xml,keyword.other.doctype.xml,variable.language.documentroot.xml#628FB5
entity.name.tag, punctuation.definition.tag.xml, punctuation.definition.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html#0000E6
support.type.property-name.css#0000E6
keyword.other#000000
keyword.control.at-rule.keyframes.css#000000bold
token.info-token#316bcd
token.warn-token#cd9731
token.error-token#cd3131
token.debug-token#800080

Shiki preview

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

Loading...

NetBeans Light Theme - Coding Theme