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.

  • actionBar.toggledBackground#121212
  • activityBar.background#000000
  • activityBar.border#121212
  • activityBar.foreground#d7dae0
  • activityBarBadge.background#d85006
  • activityBarBadge.foreground#f8fafd
  • badge.background#121212
  • button.background#d85006
  • button.secondaryBackground#ca5e24
  • button.secondaryForeground#c0bdbd
  • checkbox.border#121212
  • debugToolBar.background#121212
  • descriptionForeground#abb2bf
  • diffEditor.insertedTextBackground#00809b33
  • dropdown.background#0a0a0a
  • dropdown.border#121212
  • editor.background#000000
  • editor.findMatchBackground#d19a6644
  • editor.findMatchBorder#ffffff5a
  • editor.findMatchHighlightBackground#0a0a0a75
  • editor.foreground#abb2bf
  • editor.lineHighlightBackground#121212
  • editor.selectionBackground#67769660
  • editor.selectionHighlightBackground#676666e6
  • editor.selectionHighlightBorder#dddddd
  • editor.wordHighlightBackground#3c3c3c5a
  • editor.wordHighlightBorder#444444
  • editor.wordHighlightStrongBackground#abb2bf26
  • editor.wordHighlightStrongBorder#7f848e
  • editorBracketHighlight.foreground1#d19a66
  • editorBracketHighlight.foreground2#ba10ee
  • editorBracketHighlight.foreground3#46cddf
  • editorBracketMatch.background#515a6b
  • editorBracketMatch.border#515a6b
  • editorCursor.background#ffffffc9
  • editorCursor.foreground#39a2f7
  • editorError.foreground#c24038
  • editorGroup.border#181a1f
  • editorGroupHeader.tabsBackground#000000
  • editorGutter.addedBackground#08b176
  • editorGutter.deletedBackground#9A353D
  • editorGutter.modifiedBackground#948B60
  • editorHoverWidget.background#0a0a0a
  • editorHoverWidget.border#181a1f
  • editorHoverWidget.highlightForeground#61afef
  • editorIndentGuide.activeBackground1#c8c8c859
  • editorIndentGuide.background1#3b4048
  • editorInlayHint.background#121212
  • editorInlayHint.foreground#abb2bf
  • editorLineNumber.activeForeground#abb2bf
  • editorLineNumber.foreground#667187
  • editorMarkerNavigation.background#0a0a0a
  • editorRuler.foreground#abb2bf26
  • editorSuggestWidget.background#0a0a0a
  • editorSuggestWidget.border#181a1f
  • editorSuggestWidget.selectedBackground#121212
  • editorWarning.foreground#d19a66
  • editorWhitespace.foreground#ffffff1d
  • editorWidget.background#0a0a0a
  • focusBorder#121212
  • gitDecoration.ignoredResourceForeground#444444
  • input.background#0a0a0a
  • input.foreground#abb2bf
  • list.activeSelectionBackground#121212
  • list.activeSelectionForeground#d7dae0
  • list.focusBackground#121212
  • list.focusForeground#f0f0f0
  • list.highlightForeground#ecebeb
  • list.hoverBackground#121212
  • list.hoverForeground#abb2bf
  • list.inactiveSelectionBackground#121212
  • list.inactiveSelectionForeground#d7e0da
  • list.warningForeground#d19a66
  • menu.foreground#abb2bf
  • menu.separatorBackground#343a45
  • minimapGutter.addedBackground#0eb708
  • minimapGutter.deletedBackground#9A353D
  • minimapGutter.modifiedBackground#948B60
  • panel.border#121212
  • panelSectionHeader.background#0a0a0a
  • peekViewEditor.background#1b1d23
  • peekViewEditor.matchHighlightBackground#29244b
  • peekViewResult.background#22262b
  • scrollbar.shadow#23252c
  • scrollbarSlider.activeBackground#747d9180
  • scrollbarSlider.background#4e566660
  • scrollbarSlider.hoverBackground#5a637580
  • settings.focusedRowBackground#121212
  • settings.headerForeground#fff
  • sideBar.background#000000
  • sideBar.border#121212
  • sideBar.foreground#b0b0b0
  • sideBarSectionHeader.background#000000
  • sideBarSectionHeader.foreground#abb2bf
  • statusBar.background#000000
  • statusBar.debuggingBackground#ee5508
  • statusBar.debuggingBorder#ff000000
  • statusBar.debuggingForeground#ffffff
  • statusBar.foreground#9da5b4
  • statusBar.noFolderBackground#0a0a0a
  • statusBarItem.remoteBackground#d85006
  • statusBarItem.remoteForeground#f8fafd
  • tab.activeBackground#121212
  • tab.activeBorder#333333
  • tab.activeForeground#dcdcdc
  • tab.border#121212
  • tab.hoverBackground#121212
  • tab.inactiveBackground#000000
  • tab.unfocusedHoverBackground#121212
  • terminal.ansiBlack#3f4451
  • terminal.ansiBlue#0079dc
  • terminal.ansiBrightBlack#4f5666
  • terminal.ansiBrightBlue#0093dc
  • terminal.ansiBrightCyan#00bfd4
  • terminal.ansiBrightGreen#00d212
  • terminal.ansiBrightMagenta#c42df2
  • terminal.ansiBrightRed#e01123
  • terminal.ansiBrightWhite#e6e6e6
  • terminal.ansiBrightYellow#fc922e
  • terminal.ansiCyan#25dcf4
  • terminal.ansiGreen#00cb11
  • terminal.ansiMagenta#c42df2
  • terminal.ansiRed#e05561
  • terminal.ansiWhite#d7dae0
  • terminal.ansiYellow#ef8828
  • terminal.background#000000
  • terminal.border#121212
  • terminal.foreground#abb2bf
  • terminal.selectionBackground#abb2bf30
  • textBlockQuote.background#2e3440
  • textBlockQuote.border#2a2d32
  • textLink.foreground#2296f5
  • textPreformat.foreground#d19a66
  • titleBar.activeBackground#000000
  • titleBar.activeForeground#9da5b4
  • titleBar.inactiveBackground#000000
  • titleBar.inactiveForeground#6b717d
  • tree.indentGuidesStroke#ffffff1d
  • walkThrough.embeddedEditorBackground#16181c

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#f94f5d
variable.other.generic-type.haskell#bc2ce8
storage.type.haskell#d19a66
support.variable.magic.python#f94f5d
punctuation.separator.period.python,punctuation.separator.element.python,punctuation.parenthesis.begin.python,punctuation.parenthesis.end.python#abb2bf
entity.name.type.struct.c, entity.name.type.c, storage.type.typedef.c, source.c#f9af25
variable.parameter.function.language.special.self.python#f9b840
variable.parameter.function.language.special.cls.python#f9b840
storage.modifier.lifetime.rust#abb2bf
support.function.std.rust#61afef
entity.name.lifetime.rust#f9b840
variable.language.rust#f94f5d
support.constant.edge#bc2ce8
constant.other.character-class.regexp#f94f5d
keyword.operator.word#bc2ce8
keyword.operator.quantifier.regexp#d19a66
variable.parameter.function#abb2bf
comment markup.link#5c6370
markup.changed.diff#f9b840
meta.diff.header.from-file,meta.diff.header.to-file,punctuation.definition.from-file.diff,punctuation.definition.to-file.diff#61afef
markup.inserted.diff#0abe34
markup.deleted.diff#f94f5d
meta.function.c,meta.function.cpp#f94f5d
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#36a4ff
support.constant.math#f9b840
support.constant.property.math#f9b840
variable.other.constant#f9b840
storage.type.annotation.java, storage.type.object.array.java#f9b840
source.java#f94f5d
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#269afa
storage.modifier.import.java,storage.type.java,storage.type.generic.java#f9b840
keyword.operator.instanceof.java#34a2fd
meta.definition.variable.name.java#f94f5d
keyword.operator.logical#5be9fc
keyword.operator.bitwise#0fd9f4
keyword.operator.channel#32dbf1
support.constant.property-value.scss,support.constant.property-value.css#d19a66
keyword.operator.css,keyword.operator.scss,keyword.operator.less#11dbf5
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#6866d1
support.type.vendored.property-name.css#1ecee5
support.module.node,support.type.object.module,support.module.node#f9b840
entity.name.type.module#f9b840
variable.other.readwrite,meta.object-literal.key,support.variable.property,support.variable.object.process,support.variable.object.node#f94f5d
support.constant.json#e78b35
keyword.operator.expression.instanceof, keyword.operator.new, keyword.operator.ternary, keyword.operator.optional, keyword.operator.expression.keyof#bc2ce8
support.type.object.console#f94f5d
support.variable.property.process#d19a66
entity.name.function,support.function.console#1c8fed
keyword.operator.misc.rust#abb2bf
keyword.operator.sigil.rust#bc2ce8
keyword.operator.delete#bc2ce8
support.type.object.dom#56b6c2
support.variable.dom,support.variable.property.dom#f94f5d
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#bc2ce8
punctuation.separator.delimiter#abb2bf
punctuation.separator.c,punctuation.separator.cpp#bc2ce8
support.type.posix-reserved.c,support.type.posix-reserved.cpp#56b6c2
keyword.operator.sizeof.c,keyword.operator.sizeof.cpp#bc2ce8
variable.parameter.function.language.python#e79344
support.type.python#33d4e9
keyword.operator.logical.python#bc2ce8
variable.parameter.function.python#e1944c
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#61afef
constant.character.format.placeholder.other.python#ff922c
keyword.operator#abbfb2
keyword.operator.assignment.compound#bc2ce8
keyword.operator.assignment.compound.js,keyword.operator.assignment.compound.ts#56b6c2
keyword#bc2ce8
entity.name.namespace#f9b840
variable#f94f5d
variable.c#f9b840
variable.language#f9b840
token.variable.parameter.java#abb2bf
import.storage.java#f9b840
token.package.keyword#bc2ce8
token.package#abb2bf
entity.name.function, meta.require, support.function.any-method, variable.function#39a2f7
entity.name.type.namespace#f9b840
support.class, entity.name.type.class#f9b840
entity.name.class.identifier.namespace.type#f9b840
entity.name.class, variable.other.class.js, variable.other.class.ts#f9b840
variable.other.class.php#f94f5d
entity.name.type#f9b840
keyword.control#bc2ce8
control.elements, keyword.operator.less#d19a66
keyword.other.special-method#61afef
storage#bc2ce8
token.storage#bc2ce8
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#bc2ce8
token.storage.type.java#f9b840
support.function#56b6c2
support.type.property-name#abb2bf
support.type.property-name.toml, support.type.property-name.table.toml, support.type.property-name.array.toml#f94f5d
support.constant.property-value#abb2bf
support.constant.font-name#d19a66
meta.tag#abb2bf
string#42dc4f
constant.other.symbol#56b6c2
constant.numeric#d88333
constant#d36e0f
punctuation.definition.constant#5c75f2
entity.name.tag#f94f5d
entity.other.attribute-name#ef8d32
entity.other.attribute-name.id#3ca4f9
entity.other.attribute-name.class.css#d19a66
meta.selector#bc2ce8
markup.heading#f94f5d
markup.heading punctuation.definition.heading, entity.name.section#61afef
keyword.other.unit#f94f5d
markup.bold,todo.bold#299fff
punctuation.definition.bold#f9b840
markup.italic, punctuation.definition.italic,todo.emphasis#bc2ce8
emphasis md#bc2ce8
entity.name.section.markdown#0fd9f4
punctuation.definition.heading.markdown#0fd9f4
punctuation.definition.list.begin.markdown#f38a27
markup.heading.setext#abb2bf
punctuation.definition.bold.markdown#f38a27
markup.inline.raw.markdown#5cd903
markup.inline.raw.string.markdown#5ddb03
punctuation.definition.raw.markdown#faad1d
punctuation.definition.list.markdown#f9b840
punctuation.definition.string.begin.markdown, punctuation.definition.string.end.markdown, punctuation.definition.metadata.markdown#f94f5d
beginning.punctuation.definition.list.markdown#f94f5d
punctuation.definition.metadata.markdown#f94f5d
markup.underline.link.markdown,markup.underline.link.image.markdown#bc2ce8
string.other.link.title.markdown,string.other.link.description.markdown#61afef
markup.raw.monospace.asciidoc#93da61
punctuation.definition.asciidoc#f9b840
markup.list.asciidoc#f9b840
markup.link.asciidoc,markup.other.url.asciidoc#bc2ce8
string.unquoted.asciidoc,markup.other.url.asciidoc#61afef
string.regexp#17ddf7
punctuation.section.embedded, variable.interpolation#f94f5d
punctuation.section.embedded.begin,punctuation.section.embedded.end#bc2ce8
invalid.illegal#ffffff
invalid.illegal.bad-ampersand.html#abb2bf
invalid.illegal.unrecognized-tag.html#f94f5d
invalid.broken#ffffff
invalid.deprecated#ffffff
invalid.deprecated.entity.other.attribute-name.html#fda24e
invalid.unimplemented#ffffff
source.json meta.structure.dictionary.json > string.quoted.json#f94f5d
source.json meta.structure.dictionary.json > string.quoted.json > punctuation.string#f94f5d
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#f94f5d
support.type.property-name.json punctuation#f94f5d
text.html.laravel-blade source.php.embedded.line.html entity.name.tag.laravel-blade#bc2ce8
text.html.laravel-blade source.php.embedded.line.html support.constant.laravel-blade#bc2ce8
support.other.namespace.use.php,support.other.namespace.use-as.php,entity.other.alias.php,meta.interface.php#f9b840
keyword.operator.error-control.php#bc2ce8
keyword.operator.type.php#bc2ce8
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#f9b840
meta.function-call.php,meta.function-call.object.php,meta.function-call.static.php#61afef
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#f3a55c
support.constant.ext.php,support.constant.std.php,support.constant.core.php,support.constant.parser-token.php#f3a55c
entity.name.goto-label.php,support.other.php#61afef
keyword.operator.logical.php,keyword.operator.bitwise.php,keyword.operator.arithmetic.php#56b6c2
keyword.operator.regexp.php#bc2ce8
keyword.operator.comparison.php#56b6c2
keyword.operator.heredoc.php,keyword.operator.nowdoc.php#bc2ce8
meta.function.decorator.python#61afef
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
constant.language.symbol.hashkey.ruby#56b6c2
rgb-value#56b6c2
inline-color-decoration rgb-value#d19a66
less rgb-value#d19a66
selector.sass#f94f5d
support.type.primitive.ts,support.type.builtin.ts,support.type.primitive.tsx,support.type.builtin.tsx#f9b840
block.scope.end,block.scope.begin#abb2bf
storage.type.cs#f9b840
entity.name.variable.local.cs#f94f5d
token.info-token#61afef
token.warn-token#d19a66
token.error-token#f44747
token.debug-token#bc2ce8
punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.section.embedded#bc2ce8
meta.template.expression#abb2bf
keyword.operator.module#bc2ce8
support.type.type.flowtype#61afef
support.type.primitive#f9b840
meta.property.object#f94f5d
variable.parameter.function.js#f94f5d
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#f9b840
keyword.operator.arithmetic.go, keyword.operator.address.go#bc2ce8
keyword.operator.arithmetic.c, keyword.operator.arithmetic.cpp#bc2ce8
entity.name.package.go#f9b840
support.type.prelude.elm#56b6c2
support.constant.elm#d19a66
punctuation.quasi.element#bc2ce8
constant.character.entity#f94f5d
entity.other.attribute-name.pseudo-element, entity.other.attribute-name.pseudo-class#1ecee5
entity.global.clojure#f9b840
meta.symbol.clojure#f94f5d
constant.keyword.clojure#3ad1e5
meta.arguments.coffee, variable.parameter.function.coffee#f94f5d
source.ini#98c379
meta.scope.prerequisites.makefile#f94f5d
source.makefile#f9b840
storage.modifier.import.groovy#f9b840
meta.method.groovy#61afef
meta.definition.variable.name.groovy#f94f5d
meta.definition.class.inherited.classes.groovy#98c379
support.variable.semantic.hlsl#f9b840
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#bc2ce8
text.variable, text.bracketed#f94f5d
support.type.swift, support.type.vb.asp#f9b840
entity.name.function.xi#f9b840
entity.name.class.xi#1bd0e8
constant.character.character-class.regexp.xi#f94f5d
constant.regexp.xi#bc2ce8
keyword.control.xi#1dcce3
constant.numeric, constant.numeric.integer, constant.numeric.float, constant.numeric.hex, constant.numeric.binary, constant.numeric.octal, constant.numeric.decimal, constant.language.numeric#35b2ff
constant.language.boolean, constant.language.true, constant.language.false#ff5e00
constant.language.null, constant.language.undefined, constant.language.none, constant.language.nil, constant.language#ad05e0
invalid.xi#abb2bf
beginning.punctuation.definition.quote.markdown.xi#98c379
markup.quote.markdown#7fb757
beginning.punctuation.definition.list.markdown.xi#9c9c9c
constant.character.xi#1b98ff
accent.xi#43aafe
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#f9b840
entity.name.label.cs, markup.heading.setext.1.markdown, markup.heading.setext.2.markdown#f94f5d
meta.brace.square#abb2bf
comment, punctuation.definition.comment#9c9c9citalic
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#f9b840
entity.name.variable.field.cs#f94f5d
markup.deleted#f94f5d
markup.inserted#98c379
markup.underlineunderline
punctuation.section.embedded.begin.php, punctuation.section.embedded.end.php#BE5046
support.other.namespace.php#abb2bf
variable.parameter.function.latex#f94f5d
variable.other.object#f9b840
variable.other.constant.property#f94f5d
entity.other.inherited-class#f9b840
variable.other.readwrite.c#f94f5d
entity.name.variable.parameter.php,punctuation.separator.colon.php,constant.other.php#abb2bf
constant.numeric.decimal.asm.x86_64#bc2ce8
support.other.parenthesis.regexp#d19a66
constant.character.escape#24d9f1
string.regexp#f94f5d
log.info#98c379
log.warning#f9b840
log.error#f94f5d
keyword.operator.expression.is#bc2ce8
entity.name.label#f94f5d
support.class.math.block.environment.latex, constant.other.general.math.tex#61afef
constant.character.math.tex#98c379