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#000
  • activityBar.border#111
  • editor.background#000
  • editorGroup.border#111
  • editorGroupHeader.border#111
  • editorGroupHeader.tabsBackground#000
  • foreground#aaa
  • menu.border#111
  • sideBar.background#000
  • sideBar.border#111
  • statusBar.background#000
  • statusBar.border#111
  • tab.border#111
  • tab.inactiveBackground#000
  • tab.inactiveForeground#666
  • titleBar.activeBackground#000
  • titleBar.activeForeground#aaa
  • titleBar.border#111
  • titleBar.inactiveForeground#444

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
constant.other.character-class.regexp#e06c75ff
keyword.operator.quantifier.regexp#f80
punctuation.definition.string.begin,punctuation.definition.string.end#98c378
variable.parameter.function#A6B2C0
comment, punctuation.definition.comment, comment.block.documentation.cfml, comment.block.documentation.js, comment.block.documentation.ts, comment.line.double-slash.cfml, comment.line.double-slash.js, comment.line.double-slash.ts, comment.line.double-slash.php, comment.block.documentation.phpdoc.php#666italic
comment markup.link#666
markup.changed.diff#e0c285
meta.diff.header.from-file,punctuation.definition.from-file.diff#569cd6
markup.inserted.diff#af0
markup.deleted.diff#f40
meta.function.c#f40
keyword.control.cpp#fc0
punctuation.section.block.begin.bracket.curly.cpp, punctuation.section.block.end.bracket.curly.cpp, punctuation.terminator.statement.c, punctuation.section.block.begin.bracket.curly.c, punctuation.section.block.end.bracket.curly.c, punctuation.section.parens.begin.bracket.round.c, punctuation.section.parens.end.bracket.round.c, punctuation.section.parameters.begin.bracket.round.c, punctuation.section.parameters.end.bracket.round.c#fff
punctuation.separator.key-value#bbbbbb
entity.other.attribute-name.js, entity.other.attribute-name.ts, entity.other.attribute-name.jsx, entity.other.attribute-name.tsx, variable.parameter, variable.language.superitalic
keyword.operator.expression.import#4af
support.constant.math#fc0
support.constant.property.math#f80
variable.other.constant#fc0
storage.type.annotation.java#fc0
source.java#f40
punctuation.section.block.begin.java, punctuation.section.block.end.java, punctuation.definition.method-parameters.begin.java, punctuation.definition.method-parameters.end.java, meta.method.identifier.java, punctuation.section.method.begin.java, punctuation.section.method.end.java, punctuation.terminator.java, punctuation.section.class.begin.java, punctuation.section.class.end.java, punctuation.section.inner-class.begin.java, punctuation.section.inner-class.end.java, meta.method-call.java, storage.type.generic.java, punctuation.section.class.begin.bracket.curly.java, punctuation.section.class.end.bracket.curly.java, punctuation.section.method.begin.bracket.curly.java, punctuation.section.method.end.bracket.curly.java, punctuation.separator.period.java, meta.method.body.java#fff
meta.method.java#4af
storage.modifier.import.java, storage.type.java#fc0
meta.definition.variable.name.java#f40
keyword.operator.logical.js#0ff
keyword.operator.bitwise#0ff
support.constant.property-value.scss,support.constant.property-value.css#f80
support.constant.color.w3c-standard-color-name.css,support.constant.color.w3c-standard-color-name.scss#f80
punctuation.separator.list.comma.css#b9c0ca
support.constant.color.w3c-standard-color-name.css#f80
support.type.vendored.property-name.css#0ff
punctuation.definition.template-expression.begin,punctuation.definition.template-expression.end#f40
support.module.node,support.type.object.module,support.module.node#fc0
variable.other.readwrite,meta.object-literal.key,support.variable.property,support.variable.object.process,support.variable.object.node#f40
comment.line.double-slash,comment.block.documentationitalic
support.constant.json#f80
keyword.operator.expression.instanceof,keyword.operator.new,keyword.operator.ternary#c0f
support.type.object.console#f40
support.variable.property.process#f80
entity.name.function,support.function.console#4af
keyword.operator#0ff
support.type.object.dom#0ff
support.variable.dom,support.variable.property.dom#f40
keyword.operator.arithmetic, keyword.operator.comparison, keyword.operator, punctuation.separator, punctuation.terminator#0ff
keyword.operator.assignment.c,keyword.operator.comparison.c,keyword.operator.c,keyword.operator.increment.c#c0f
punctuation.separator.delimiter.c#bbbbbb
support.type.posix-reserved.c#57adb8
keyword.operator.sizeof.c#C178DD
variable.parameter.function.language.python#f80
support.type.python#0ff
keyword.operator.logical.python#c0f
meta.function-call.arguments.python#E06C60
meta.function-call.python#E06C60
variable.parameter.function.python#D18C4E
punctuation.definition.arguments.begin.python, punctuation.definition.arguments.end.python, punctuation.definition.list.begin.python, punctuation.definition.list.end.python, meta.function-call.arguments.python#fff
meta.function-call.generic.python#4af
constant.character.format.placeholder.other.python#98c379
none#A6B2C0
keyword.operator#fff
keyword#c0f
variable#f40
token.variable.parameter.java#fff
import.storage.java#fc0
token.package.keyword#c0f
token.package#fff
entity.name.function, meta.require, support.function.any-method#4af
entity.name.type.namespace#fc0
support.class, entity.name.type.class#fc0
entity.name.class.identifier.namespace.type#fc0
entity.name.class#4af
entity.name.type#fc0
keyword.control#c0fitalic
control.elements, keyword.operator.less#f80
keyword.other.special-method#4af
storage#c0fitalic
token.storage#c0f
storage.type.function.arrow
keyword.operator.expression.delete,keyword.operator.expression.in,keyword.operator.expression.of,keyword.operator.expression.instanceof,keyword.operator.new,keyword.operator.expression.typeof,keyword.operator.expression.void#c0f
token.storage.type.java#fc0
support.function#0ff
support.type.property-name#fff
support.constant.property-value#fff
support.constant.font-name#f80
meta.tag#fff
string, entity.other.inherited-class#af0
constant.other.symbol#0ff
constant.numeric#f80
none#f80
none#f80
constant#f80
punctuation.definition.constant#f80
entity.name.tag#f40
entity.other.attribute-name#f80
entity.other.attribute-name.id#4af
entity.other.attribute-name.class.css#f80
meta.selector#c0f
none#D2945D
markup.heading#f40bold
markup.heading punctuation.definition.heading, entity.name.section#4af
keyword.other.unit#f80
markup.bold,todo.bold#f80bold
punctuation.definition.bold#fc0
markup.italic, punctuation.definition.italic,todo.emphasis#c0f
emphasis md#c0f
entity.name.section.markdown#f40
punctuation.definition.heading.markdown#f40
markup.heading.setext#fff
punctuation.definition.bold.markdown#f80
markup.inline.raw.markdown#af0
markup.inline.raw.string.markdown#98c379
beginning.punctuation.definition.list.markdown#f40
markup.quote.markdown#666italic
punctuation.definition.string.begin.markdown,punctuation.definition.string.end.markdown,punctuation.definition.metadata.markdown#fff
punctuation.definition.metadata.markdown#c0f
markup.underline.link.markdown,markup.underline.link.image.markdown#c0f
string.other.link.title.markdown,string.other.link.description.markdown#4af
markup.italic.markdownitalic
markup.bold.markdownbold
string.regexp#57B6C2
constant.character.escape#57B6C2
punctuation.section.embedded, variable.interpolation#BE4F44
invalid.illegal#FFFFFF
invalid.broken#FFFFFF
invalid.deprecated#FFFFFF
invalid.unimplemented#FFFFFF
source.json meta.structure.dictionary.json > string.quoted.json#f40
source.json meta.structure.dictionary.json > string.quoted.json > punctuation.string#f40
source.json meta.structure.dictionary.json > value.json > string.quoted.json,source.json meta.structure.array.json > value.json > string.quoted.json,source.json meta.structure.dictionary.json > value.json > string.quoted.json > punctuation,source.json meta.structure.array.json > value.json > string.quoted.json > punctuation#af0
source.json meta.structure.dictionary.json > constant.language.json,source.json meta.structure.array.json > constant.language.json#0ff
support.type.property-name.json#f40
support.type.property-name.json punctuation#f40
text.html.laravel-blade source.php.embedded.line.html entity.name.tag.laravel-blade#C679DD
text.html.laravel-blade source.php.embedded.line.html support.constant.laravel-blade#C679DD
support.other.namespace.use.php,support.other.namespace.use-as.php,support.other.namespace.php,entity.other.alias.php#fc0
keyword.operator.error-control.php#c0f
keyword.operator.type.php#c0f
punctuation.section.array.begin.php#fff
punctuation.section.array.end.php#fff
invalid.illegal.non-null-typehinted.php#ff0000
storage.type.php,meta.other.type.phpdoc.php,keyword.other.type.php,keyword.other.array.phpdoc.php#fc0
meta.function-call.php,meta.function-call.object.php,meta.function-call.static.php#4af
punctuation.definition.parameters.begin.bracket.round.php, punctuation.definition.parameters.end.bracket.round.php, punctuation.separator.delimiter.php, punctuation.section.scope.begin.php, punctuation.section.scope.end.php, punctuation.terminator.expression.php, punctuation.definition.arguments.begin.bracket.round.php, punctuation.definition.arguments.end.bracket.round.php, punctuation.definition.storage-type.begin.bracket.round.php, punctuation.definition.storage-type.end.bracket.round.php, punctuation.definition.array.begin.bracket.round.php, punctuation.definition.array.end.bracket.round.php, punctuation.definition.begin.bracket.round.php, punctuation.definition.end.bracket.round.php, punctuation.definition.begin.bracket.curly.php, punctuation.definition.end.bracket.curly.php, punctuation.definition.section.switch-block.end.bracket.curly.php, punctuation.definition.section.switch-block.start.bracket.curly.php, punctuation.definition.section.switch-block.begin.bracket.curly.php, punctuation.definition.section.switch-block.end.bracket.curly.php#bbbbbb
support.constant.ext.php,support.constant.std.php,support.constant.core.php,support.constant.parser-token.php#f80
entity.name.goto-label.php,support.other.php#4af
keyword.operator.logical.php,keyword.operator.bitwise.php,keyword.operator.arithmetic.php#0ff
keyword.operator.regexp.php#c0f
keyword.operator.comparison.php#0ff
punctuation.definition.variable.php#f40
keyword.operator.heredoc.php,keyword.operator.nowdoc.php#c0f
meta.function.decorator.python#4af
support.token.decorator.python,meta.function.decorator.identifier.python#0ff
function.parameter#f80
function.parameter#fff
function.brace#fff
function.parameter.ruby, function.parameter.cs#fff
rgb-value#0ff
inline-color-decoration rgb-value#f80
less rgb-value#f80
selector.sass#f40
var.this,variable.language.this.js,variable.language.this.ts,variable.language.this.jsx,variable.language.this.tsx#fc0italic
support.type.primitive.ts,support.type.builtin.ts,support.type.primitive.tsx,support.type.builtin.tsx#fc0
block.scope.end,block.scope.begin#fff
storage.type.cs#fc0
entity.name.variable.local.cs#f40
token.info-token#6796e6
token.warn-token#cd9731
token.error-token#f40747
token.debug-token#b267e6
emphasisitalic
entity.other.attribute-name.html, entity.other.attribute-name.tag.jade, entity.other.attribute-name.tag.pug, entity.other.attribute-name.cfml, keyword.operator.expression.delete, keyword.other.required.argument.cfml, keyword.other.namespace.php, keyword.other.use.phpitalic
variable.language#e06c75italic
variable.parameter,entity.other.function-parameter.cfml#f80italic
Covcg Theme by Carlos Guillermo Coello Valenzuela - VS Code Theme