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#050809
  • activityBar.foreground#5DBFCC
  • editor.background#070A0E
  • editor.foreground#C8D3E0
  • editor.lineHighlightBackground#0A0D12
  • editor.selectionBackground#162331
  • editor.wordHighlightBackground#162331
  • editorGroupHeader.tabsBackground#050809
  • sideBar.background#070A0E
  • sideBar.foreground#97A8BC
  • statusBar.background#050809
  • statusBar.foreground#5DBFCC
  • tab.activeBackground#070A0E
  • tab.inactiveBackground#050809
  • titleBar.activeBackground#050809

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
comment, punctuation.definition.comment, comment.block.documentation, comment.block.javadoc, comment.line.double-slash, comment.line.number-sign.python, comment.line.hash.ruby, comment.block.documentation.rust, comment.line.documentation.rust, comment.block.documentation.ts, comment.block.html, comment.block.documentation.php, comment.line.triple-slash.directive#425165italic
variable, string constant.other.placeholder, variable.other.readwrite, variable.parameter, variable.other.object, variable.language, variable.other.property, variable.other.member, variable.scss, variable.other.php, variable.other.normal.shell, variable.other.special.rust, variable.other.readwrite.global, variable.other.constant#B8C6D5
keyword, storage.type, storage.modifier, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.control.flow, storage.type.class.python, storage.type.function.python, keyword.other.fn.rust, storage.type.cs, keyword.package.go, storage.type.kotlin, keyword.control.import, keyword.control.export, keyword.control.default, storage.type.class.ts, storage.modifier.async#B782DA
keyword.operator, punctuation, meta.brace, meta.delimiter, punctuation.definition.parameters, punctuation.separator, punctuation.terminator, punctuation.accessor, keyword.operator.arithmetic, keyword.operator.comparison, keyword.operator.assignment, keyword.operator.type.annotation, keyword.operator.optional, meta.decorator punctuation#5DBFCC
entity.name.tag, support.class.component, entity.name.tag.html, entity.name.tag.xml, entity.name.tag.jsx, entity.name.tag.tsx, punctuation.definition.tag, meta.tag.sgml, meta.tag.html, meta.tag.xml, meta.tag.js, meta.tag.tsx#5DBFCC
entity.name.function, meta.function-call, variable.function, support.function, keyword.other.special-method, meta.method-call, meta.function, support.function.builtin, support.function.core, meta.function.python, entity.name.function.go, entity.name.function.rust, entity.name.function.php, support.function.magic, meta.function-call.generic#729AEF
constant.numeric, constant.language, support.constant, constant.character, constant.escape, keyword.other.unit, constant.other.color, constant.other.symbol, constant.other.key, support.constant.property-value, constant.numeric.decimal, constant.numeric.integer, constant.numeric.hex, constant.numeric.binary#E77C5C
string, string.quoted.single, string.quoted.double, string.template, string.interpolated, string.regexp, string.other.link, string.quoted.backtick, string.unquoted.heredoc, string.quoted.triple, string.quoted.docstring.multi.python, string.template.js#7DB881
entity.name.type, support.type, support.class, storage.type.generic, storage.type.primitive, entity.name.class, entity.other.inherited-class, entity.name.struct, entity.name.enum, entity.name.interface, support.type.builtin, storage.type.builtin, entity.name.type.class, entity.name.type.module, entity.name.type.parameter#EFA85C
entity.other.attribute-name, entity.other.attribute-name.html, entity.other.attribute-name.jsx, entity.other.attribute-name.tsx, entity.other.attribute-name.class.css, meta.decorator, meta.decorator entity.name.function, meta.decorator variable.other.readwrite, meta.decorator punctuation.decorator, entity.other.attribute-name.id#EF97B4
support.type.property-name.css, support.type.property-name.scss, support.type.property-name.less, support.type.property-name.sass, support.type.vendored.property-name, support.constant.property-value.css, support.constant.font-name, support.constant.media#5DBFCC
markup.heading, markup.bold, markup.italic, markup.inline.raw, markup.quote, markup.list, markup.link, markup.underline, markup.raw.block, markup.fenced_code#729AEF
variable.language.self, variable.language.this, variable.language.super, variable.language.special.self.python, variable.language.this.php, variable.language.this.ts, variable.language.arguments, variable.language.global#B782DAitalic
punctuation.definition.template-expression, punctuation.section.embedded, meta.embedded.line, meta.template.expression, meta.embedded.expression#5DBFCC