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.activeBackground#DDDDDD
  • activityBar.background#EFEFEF
  • activityBar.foreground#333333
  • activityBarBadge.background#2361ba
  • activityBarBadge.foreground#FFFFFF
  • badge.background#2361ba
  • badge.foreground#FFFFFF
  • button.background#2361ba
  • button.foreground#FFFFFF
  • debugToolBar.background#EFEFEF
  • dropdown.background#F0F0F0
  • editor.background#FAFAFA
  • editor.foreground#383A42
  • editor.lineHighlightBorder#0000000f
  • editor.selectionBackground#2361ba44
  • editor.selectionHighlightBackground#0001
  • editor.wordHighlightBackground#0000001a
  • editorCursor.foreground#47ff6f
  • editorGroupHeader.tabsBackground#EFEFEF
  • editorSuggestWidget.background#F5F5F5
  • editorSuggestWidget.border#CCCCCC
  • editorWidget.background#F5F5F5
  • editorWidget.border#CCCCCC
  • focusBorder#2361ba
  • input.background#F0F0F0
  • input.border#CCCCCC
  • input.foreground#333333
  • list.activeSelectionBackground#2361ba
  • list.activeSelectionForeground#FFFFFF
  • list.hoverBackground#E5E5E5
  • list.inactiveSelectionBackground#DDDDDD
  • menu.background#F5F5F5
  • menubar.selectionBackground#2361ba
  • minimap.background#F0F0F0BB
  • minimap.selectionHighlight#2361ba44
  • notifications.background#FAFAFA
  • panel.background#EFEFEF
  • panel.border#CCCCCC
  • quickInput.background#FAFAFA
  • quickInputList.focusBackground#2361ba
  • selection.background#2361ba
  • settings.checkboxBackground#F0F0F0
  • settings.textInputBackground#F0F0F0
  • sideBar.background#EFEFEF
  • sideBar.border#CCCCCC
  • sideBarSectionHeader.background#E5E5E5
  • sideBarTitle.foreground#333333
  • statusBar.background#000
  • statusBar.border#CCCCCC
  • statusBar.debuggingBackground#bf6600
  • statusBar.foreground#FFFFFF
  • tab.activeForeground#333333
  • tab.border#CCCCCC
  • tab.hoverBorder#2361ba
  • tab.inactiveBackground#EFEFEF
  • tab.inactiveForeground#777777
  • terminal.background#FAFAFA
  • terminal.foreground#383A42
  • titleBar.activeBackground#EFEFEF
  • titleBar.activeForeground#333333
  • titleBar.border#CCCCCC
  • titleBar.inactiveBackground#E5E5E5
  • titleBar.inactiveForeground#666666

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
meta.embedded#383A42
punctuation.definition.delayed.unison,punctuation.definition.list.begin.unison,punctuation.definition.list.end.unison,punctuation.definition.ability.begin.unison,punctuation.definition.ability.end.unison,punctuation.operator.assignment.as.unison,punctuation.separator.pipe.unison,punctuation.separator.delimiter.unison,punctuation.definition.hash.unison#B85C00
variable.other.generic-type.haskell#1A6498
storage.type.haskell#694F8E
support.variable.magic.python#B85C00
punctuation.separator.period.python,punctuation.separator.element.python,punctuation.parenthesis.begin.python,punctuation.parenthesis.end.python#383A42
variable.parameter.function.language.special.self.python#B85C00
variable.parameter.function.language.special.cls.python#B85C00
storage.modifier.lifetime.rust#383A42
support.function.std.rust#8A6500
entity.name.lifetime.rust#B85C00
variable.language.rust#B85C00
support.constant.edge#694F8E
constant.other.character-class.regexp#B85C00
keyword.operator.word#B85C00
keyword.operator.quantifier.regexp#1A6498
variable.parameter.function#383A42
comment markup.link#7C8390
markup.changed.diff#B85C00
meta.diff.header.from-file,meta.diff.header.to-file,punctuation.definition.from-file.diff,punctuation.definition.to-file.diff#383A42
markup.inserted.diff#3D5E30
markup.deleted.diff#B85C00
meta.function.c,meta.function.cpp#8A6500
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#383A42
punctuation.separator.key-value#383A42
keyword.operator.expression.import#B85C00
support.constant.math#694F8E
support.constant.property.math#694F8E
variable.other.constant#694F8E
storage.type.annotation.java, storage.type.object.array.java#383A42
source.java#383A42
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,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,punctuation.bracket.angle.java,punctuation.definition.annotation.java,meta.method.body.java#383A42
meta.method.java#8A6500
storage.modifier.import.java,storage.type.java,storage.type.generic.java#383A42
keyword.operator.instanceof.java#B85C00
meta.definition.variable.name.java#383A42
keyword.operator.logical#383A42
keyword.operator.bitwise#383A42
keyword.operator.channel#383A42
support.constant.property-value.scss,support.constant.property-value.css#694F8E
keyword.operator.css,keyword.operator.scss,keyword.operator.less#383A42
support.constant.color.w3c-standard-color-name.css,support.constant.color.w3c-standard-color-name.scss#694F8E
punctuation.separator.list.comma.css#383A42
support.constant.color.w3c-standard-color-name.css#694F8E
support.type.vendored.property-name.css#383A42
support.module.node,support.type.object.module,support.module.node#383A42
entity.name.type.module#383A42
variable.other.readwrite,meta.object-literal.key,support.variable.property,support.variable.object.process,support.variable.object.node#694F8E
support.constant.json#694F8E
keyword.operator.expression.instanceof, keyword.operator.new, keyword.operator.ternary, keyword.operator.optional, keyword.operator.expression.keyof#B85C00
support.type.object.console#383A42
support.variable.property.process#694F8E
entity.name.function,support.function.console#8A6500
keyword.operator.misc.rust#383A42
keyword.operator.sigil.rust#B85C00
keyword.operator.delete#B85C00
support.type.object.dom#383A42
support.variable.dom,support.variable.property.dom#694F8E
keyword.operator.arithmetic,keyword.operator.comparison,keyword.operator.decrement,keyword.operator.increment,keyword.operator.relational#383A42
keyword.operator.assignment.c,keyword.operator.comparison.c,keyword.operator.c,keyword.operator.increment.c,keyword.operator.decrement.c,keyword.operator.bitwise.shift.c,keyword.operator.assignment.cpp,keyword.operator.comparison.cpp,keyword.operator.cpp,keyword.operator.increment.cpp,keyword.operator.decrement.cpp,keyword.operator.bitwise.shift.cpp#383A42
punctuation.separator.delimiter#383A42
punctuation.separator.c,punctuation.separator.cpp#383A42
support.type.posix-reserved.c,support.type.posix-reserved.cpp#383A42
keyword.operator.sizeof.c,keyword.operator.sizeof.cpp#B85C00
variable.parameter.function.language.python#383A42
support.type.python#383A42
keyword.operator.logical.python#B85C00
variable.parameter.function.python#383A42
punctuation.definition.arguments.begin.python,punctuation.definition.arguments.end.python,punctuation.separator.arguments.python,punctuation.definition.list.begin.python,punctuation.definition.list.end.python#383A42
meta.function-call.generic.python#8A6500
constant.character.format.placeholder.other.python#694F8E
keyword.operator#383A42
keyword.operator.assignment.compound#383A42
keyword.operator.assignment.compound.js,keyword.operator.assignment.compound.ts#383A42
keyword#B85C00
entity.name.namespace#383A42
variable#383A42
variable.c#383A42
variable.language#B85C00
token.variable.parameter.java#383A42
import.storage.java#383A42
token.package.keyword#B85C00
token.package#383A42
entity.name.function, meta.require, support.function.any-method, variable.function#8A6500
entity.name.type.namespace#383A42
support.class, entity.name.type.class#383A42
entity.name.class.identifier.namespace.type#383A42
entity.name.class, variable.other.class.js, variable.other.class.ts#383A42
variable.other.class.php#383A42
entity.name.type#383A42
keyword.control#B85C00
control.elements, keyword.operator.less#B85C00
keyword.other.special-method#8A6500
storage#B85C00
storage.type.class.doxygen.c#7A7200
token.storage#B85C00
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#B85C00
token.storage.type.java#B85C00
support.function#8A6500
support.type.property-name#694F8E
support.constant.property-value#694F8E
support.constant.font-name#3D5E30
meta.tag#383A42
string#3D5E30
constant.other.symbol#694F8E
constant.numeric#1A6498
constant#1A6498
punctuation.definition.constant#1A6498
entity.name.tag#8A6800
entity.other.attribute-name#383A42
entity.other.attribute-name.id#383A42normal
entity.other.attribute-name.class.css#383A42normal
meta.selector#B85C00
markup.heading#8A6500
markup.heading punctuation.definition.heading, entity.name.section#383A42
keyword.other.unit#1A6498
markup.bold,todo.bold#B85C00
punctuation.definition.bold#B85C00
markup.italic, punctuation.definition.italic,todo.emphasis#B85C00
emphasis md#B85C00
entity.name.section.markdown#8A6500
punctuation.definition.heading.markdown#8A6500
punctuation.definition.list.begin.markdown#B85C00
markup.heading.setext#383A42
punctuation.definition.bold.markdown#B85C00
markup.inline.raw.markdown#3D5E30
markup.inline.raw.string.markdown#3D5E30
punctuation.definition.raw.markdown#B85C00
punctuation.definition.list.markdown#B85C00
punctuation.definition.string.begin.markdown, punctuation.definition.string.end.markdown, punctuation.definition.metadata.markdown#B85C00
beginning.punctuation.definition.list.markdown#B85C00
punctuation.definition.metadata.markdown#B85C00
markup.underline.link.markdown,markup.underline.link.image.markdown#1A6498
string.other.link.title.markdown,string.other.link.description.markdown#383A42
markup.raw.monospace.asciidoc#3D5E30
punctuation.definition.asciidoc#B85C00
markup.list.asciidoc#B85C00
markup.link.asciidoc,markup.other.url.asciidoc#1A6498
string.unquoted.asciidoc,markup.other.url.asciidoc#383A42
string.regexp#B85C00
punctuation.section.embedded, variable.interpolation#B85C00
punctuation.section.embedded.begin,punctuation.section.embedded.end#B85C00
invalid.illegal#101010
invalid.illegal.bad-ampersand.html#383A42
invalid.illegal.unrecognized-tag.html#8A6800
invalid.broken#101010
invalid.deprecated#101010
invalid.deprecated.entity.other.attribute-name.html#383A42
invalid.unimplemented#101010
source.json meta.structure.dictionary.json > string.quoted.json#694F8E
source.json meta.structure.dictionary.json > string.quoted.json > punctuation.string#694F8E
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#3D5E30
source.json meta.structure.dictionary.json > constant.language.json,source.json meta.structure.array.json > constant.language.json#694F8E
support.type.property-name.json#694F8E
support.type.property-name.json punctuation#694F8E
text.html.laravel-blade source.php.embedded.line.html entity.name.tag.laravel-blade#B85C00
text.html.laravel-blade source.php.embedded.line.html support.constant.laravel-blade#B85C00
support.other.namespace.use.php,support.other.namespace.use-as.php,entity.other.alias.php,meta.interface.php#383A42
keyword.operator.error-control.php#B85C00
keyword.operator.type.php#B85C00
punctuation.section.array.begin.php#383A42
punctuation.section.array.end.php#383A42
invalid.illegal.non-null-typehinted.php#CC0000
storage.type.php,meta.other.type.phpdoc.php,keyword.other.type.php,keyword.other.array.phpdoc.php#383A42
meta.function-call.php,meta.function-call.object.php,meta.function-call.static.php#8A6500
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#383A42
support.constant.core.rust#694F8E
support.constant.ext.php,support.constant.std.php,support.constant.core.php,support.constant.parser-token.php#694F8E
entity.name.goto-label.php,support.other.php#8A6500
keyword.operator.logical.php,keyword.operator.bitwise.php,keyword.operator.arithmetic.php#383A42
keyword.operator.regexp.php#B85C00
keyword.operator.comparison.php#383A42
keyword.operator.heredoc.php,keyword.operator.nowdoc.php#B85C00
meta.function.decorator.python#7A7200
support.token.decorator.python,meta.function.decorator.identifier.python#7A7200
function.parameter#383A42
function.brace#383A42
function.parameter.ruby, function.parameter.cs#383A42
constant.language.symbol.ruby#694F8E
rgb-value#694F8E
inline-color-decoration rgb-value#1A6498
less rgb-value#1A6498
selector.sass#8A6800
support.type.primitive.ts,support.type.builtin.ts,support.type.primitive.tsx,support.type.builtin.tsx#383A42
block.scope.end,block.scope.begin#383A42
storage.type.cs#383A42
entity.name.variable.local.cs#383A42
token.info-token#383A42
token.warn-token#B85C00
token.error-token#CC0000
token.debug-token#1A6498
punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.section.embedded#B85C00
meta.template.expression#383A42
keyword.operator.module#B85C00
support.type.type.flowtype#8A6500
support.type.primitive#383A42
meta.property.object#694F8E
variable.parameter.function.js#383A42
keyword.other.template.begin#3D5E30
keyword.other.template.end#3D5E30
keyword.other.substitution.begin#3D5E30
keyword.other.substitution.end#3D5E30
keyword.operator.assignment#383A42
keyword.operator.assignment.go#383A42
keyword.operator.arithmetic.go, keyword.operator.address.go#B85C00
entity.name.package.go#383A42
support.type.prelude.elm#383A42
support.constant.elm#694F8E
punctuation.quasi.element#B85C00
constant.character.entity#694F8E
entity.other.attribute-name.pseudo-element, entity.other.attribute-name.pseudo-class#7A7200
entity.global.clojure#383A42
meta.symbol.clojure#694F8E
constant.keyword.clojure#694F8E
meta.arguments.coffee, variable.parameter.function.coffee#383A42
source.ini#3D5E30
meta.scope.prerequisites.makefile#694F8E
source.makefile#383A42
storage.modifier.import.groovy#383A42
meta.method.groovy#8A6500
meta.definition.variable.name.groovy#383A42
meta.definition.class.inherited.classes.groovy#3D5E30
support.variable.semantic.hlsl#383A42
support.type.texture.hlsl, support.type.sampler.hlsl, support.type.object.hlsl, support.type.object.rw.hlsl, support.type.fx.hlsl, support.type.object.hlsl#B85C00
text.variable, text.bracketed#694F8E
support.type.swift, support.type.vb.asp#383A42
entity.name.function.xi#8A6500
entity.name.class.xi#383A42
constant.character.character-class.regexp.xi#694F8E
constant.regexp.xi#B85C00
keyword.control.xi#7A7200
invalid.xi#383A42
beginning.punctuation.definition.quote.markdown.xi#3D5E30
beginning.punctuation.definition.list.markdown.xi#7C8390
constant.character.xi#383A42
accent.xi#383A42
wikiword.xi#1A6498
constant.other.color.rgb-value.xi#101010
punctuation.definition.tag.xi#7C8390
entity.name.label.cs, entity.name.scope-resolution.function.call, entity.name.scope-resolution.function.definition#383A42
entity.name.label.cs, markup.heading.setext.1.markdown, markup.heading.setext.2.markdown#8A6500
meta.brace.square#383A42
comment, punctuation.definition.comment#7C8390italic
markup.quote.markdown#383A42
punctuation.definition.block.sequence.item.yaml#383A42
constant.language.symbol.elixir, constant.language.symbol.double-quoted.elixir#694F8E
entity.name.variable.parameter.cs#383A42
entity.name.variable.field.cs#694F8E
markup.deleted#B85C00
markup.inserted#3D5E30
markup.underlineunderline
punctuation.section.embedded.begin.php, punctuation.section.embedded.end.php#B85C00
support.other.namespace.php#383A42
variable.other.object#383A42
variable.other.constant.property#694F8E
entity.other.inherited-class#383A42
variable.other.readwrite.c#383A42
entity.name.variable.parameter.php,punctuation.separator.colon.php,constant.other.php#383A42
constant.numeric.decimal.asm.x86_64#1A6498
support.other.parenthesis.regexp#694F8E
constant.character.escape#B85C00
string.regexp#B85C00
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
comment.line.double-slash,comment.block.documentationitalic
keyword.control.import.python,keyword.control.flow.python,keyword.operator.logical.pythonitalic
markup.italic.markdownitalic