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#293134
  • editor.foreground#bcbcbc
  • editor.lineHighlightBackground#373a3f
  • editor.selectionBackground#3d4c4e
  • editor.selectionHighlightBackground#303b3d
  • editorCursor.foreground#bcbcbc
  • editorError.foreground#c94a4a
  • editorGutter.background#293134
  • editorIndentGuide.background#343b3f
  • editorInfo.foreground#4B4E55
  • editorLineNumber.foreground#81969A
  • editorRuler.foreground#343b3f
  • editorWarning.foreground#93c763
  • editorWhitespace.foreground#4B4E55

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
#bcbcbc
comment, comment.block.documentation.phpdoc.php#66747B
keyword.operator.js, entity.name.tag, constant.other, source.php.embedded.line, variable.parameter, meta.tag, declaration.tag, entity.name.tag.html, entity.name.tag.vue-html#93c763
entity.other.attribute-name, meta.block.open.vue, meta.block.style.vue, meta.block.close.vue, invalid.deprecated.entity.other.attribute-name.html#678CB1
variable, support.other.variable, string.other.link, entity.name.tag, entity.name.filename.find-in-files, variable.other.readwrite, meta.block, variable.other.object, meta.definition.function#bcbcbc
string.regexp, meta.link#81A2BE
constant.numeric, support.constant, punctuation.section.embedded, keyword.other.unit, constant.character.escape#FF9E3D
support.function.console, entity.name.function#8c8cb4
entity.name.class, entity.name.type.class, support.type, support.class, entity.name.tag.css#678CB1
entity.other.attribute-name.parent-selector#FF9E3D
entity.other.attribute-name.pseudo-element.css#bcbcbc
punctuation.section.embedded#8c8cb4
entity.name.function.php, meta.function-call.php, punctuation.terminator.expression.php, punctuation.section.property-list.begin.bracket.curly.css, meta.property-list.css, punctuation.section.media.begin.bracket.curly.css, meta.at-rule.media.body.css, meta.embedded.block.css, meta.block.style.vue#bcbcbc
entity.other.attribute-name.id#bcbcbc
entity.other.attribute-name.class#678CB1
support.type.property-name.css, support.type.property-name.json#8c8cb4
string, constant.other.symbol, constant.character, entity.other.inherited-class, markup.heading, constant.numeric.line-number.match.find-in-files#EC7600
entity.name.tag.localname, entity.name.type.class, support.constant.media-type.media#678CB1
variable.language#93c763
meta.block variable.other, support.type.property-name.media#8c8cb4
meta.object-literal.key, meta.object.member#8c8cb4
keyword, storage, entity.name.tag.css, constant.language#93C763
keyword.operator#678CB1
invalid#ffffff
meta.separator#ffffff
invalid.deprecated#ffffff
invalid.illegal.unrecognized-tag, invalid.illegal.character-not-allowed-here#FF0000bold
Son of Hammsidian by Bernardo Baldiviezo - VS Code Theme