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#222
  • activityBar.background#000
  • activityBar.border#222222
  • activityBar.foreground#999
  • activityBarBadge.background#2361ba
  • badge.background#2361ba
  • button.background#444
  • debugToolBar.background#000
  • dropdown.background#222
  • editor.background#000c
  • editor.foreground#c2c2c2
  • editor.lineHighlightBorder#fff0
  • editor.selectionBackground#2361ba66
  • editor.selectionHighlightBackground#fff2
  • editor.wordHighlightBackground#8d8d8d2c
  • editorCursor.foreground#47ff6f
  • editorGroupHeader.tabsBackground#000
  • editorSuggestWidget.background#222
  • editorSuggestWidget.border#222222
  • editorWidget.background#000
  • focusBorder#2361ba
  • foreground#c2c2c2
  • input.background#222
  • menu.background#000
  • menu.border#222222
  • menubar.selectionBackground#2361ba
  • minimap.background#000B
  • minimap.selectionHighlight#2361ba66
  • notifications.background#000
  • panel.background#000
  • quickInput.background#000
  • quickInputList.focusBackground#2361ba
  • selection.background#2361ba
  • settings.checkboxBackground#222
  • settings.textInputBackground#222
  • sideBar.background#000
  • sideBar.border#222222
  • sideBarSectionHeader.background#1c1c1c
  • sideBarTitle.foreground#999
  • statusBar.background#000
  • statusBar.border#222222
  • statusBar.debuggingBackground#bf6600
  • statusBar.foreground#c2c2c2
  • tab.activeBorder#aaa
  • tab.border#222222
  • tab.hoverBorder#2361ba
  • tab.inactiveBackground#000
  • terminal.background#000
  • titleBar.activeBackground#000
  • titleBar.border#222
  • titleBar.inactiveBackground#000

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

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