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#0a0d12
  • activityBar.foreground#EDEEEA
  • activityBar.inactiveForeground#79482C
  • activityBarBadge.background#c0392b
  • activityBarBadge.foreground#EDEEEA
  • badge.background#c0392b
  • button.background#7ec8e3
  • button.foreground#0a0d12
  • button.secondaryBackground#10141c
  • button.secondaryForeground#EDEEEA
  • checkbox.border#7ec8e340
  • debugToolBar.background#070a0e
  • descriptionForeground#79482C
  • diffEditor.insertedTextBackground#7ec8e320
  • dropdown.background#10141c
  • dropdown.border#7ec8e330
  • editor.background#0a0d12
  • editor.findMatchBackground#7ec8e350
  • editor.findMatchBorder#7ec8e3
  • editor.findMatchHighlightBackground#7ec8e325
  • editor.foreground#EDEEEA
  • editor.lineHighlightBackground#7ec8e310
  • editor.selectionBackground#E67D2835
  • editor.selectionHighlightBackground#E67D2820
  • editor.selectionHighlightBorder#E67D2850
  • editor.wordHighlightBackground#c0392b20
  • editor.wordHighlightBorder#c0392b50
  • editor.wordHighlightStrongBackground#c0392b35
  • editor.wordHighlightStrongBorder#c0392b70
  • editorBracketHighlight.foreground1#7ec8e3
  • editorBracketHighlight.foreground2#EDEEEA
  • editorBracketHighlight.foreground3#E67D28
  • editorBracketMatch.background#7ec8e325
  • editorBracketMatch.border#7ec8e3
  • editorCursor.background#0a0d12
  • editorCursor.foreground#7ec8e3
  • editorError.foreground#c0392b
  • editorGroup.background#0a0d12
  • editorGroup.border#7ec8e320
  • editorGroupHeader.tabsBackground#10141c
  • editorGutter.addedBackground#7ec8e3
  • editorGutter.deletedBackground#c0392b
  • editorGutter.modifiedBackground#E67D28
  • editorHoverWidget.background#070a0e
  • editorHoverWidget.border#7ec8e330
  • editorHoverWidget.highlightForeground#7ec8e3
  • editorIndentGuide.activeBackground1#7ec8e350
  • editorIndentGuide.background1#7ec8e315
  • editorInlayHint.background#10141c
  • editorInlayHint.foreground#79482C
  • editorLineNumber.activeForeground#EDEEEA
  • editorLineNumber.foreground#79482C
  • editorMarkerNavigation.background#070a0e
  • editorOverviewRuler.addedBackground#7ec8e3
  • editorOverviewRuler.deletedBackground#c0392b
  • editorOverviewRuler.modifiedBackground#E67D28
  • editorRuler.foreground#7ec8e315
  • editorSuggestWidget.background#070a0e
  • editorSuggestWidget.border#7ec8e330
  • editorSuggestWidget.selectedBackground#7ec8e325
  • editorWarning.foreground#E67D28
  • editorWhitespace.foreground#7ec8e310
  • editorWidget.background#070a0e
  • focusBorder#7ec8e3
  • foreground#a0a0a0
  • gitDecoration.addedResourceForeground#7ec8e3
  • gitDecoration.deletedResourceForeground#c0392b
  • gitDecoration.ignoredResourceForeground#79482C
  • gitDecoration.modifiedResourceForeground#E67D28
  • gitDecoration.untrackedResourceForeground#7ec8e3
  • input.background#070a0e
  • input.foreground#EDEEEA
  • list.activeSelectionBackground#7ec8e325
  • list.activeSelectionForeground#EDEEEA
  • list.focusBackground#7ec8e320
  • list.focusForeground#EDEEEA
  • list.highlightForeground#7ec8e3
  • list.hoverBackground#7ec8e310
  • list.hoverForeground#EDEEEA
  • list.inactiveSelectionBackground#7ec8e315
  • list.inactiveSelectionForeground#EDEEEA
  • list.warningForeground#E67D28
  • menu.background#10141ccc
  • menu.foreground#a0a0a0
  • menu.selectionBackground#7ec8e325
  • menu.selectionForeground#EDEEEA
  • menu.separatorBackground#7ec8e320
  • menubar.selectionBackground#7ec8e320
  • menubar.selectionForeground#EDEEEA
  • minimapGutter.addedBackground#7ec8e3
  • minimapGutter.deletedBackground#c0392b
  • minimapGutter.modifiedBackground#E67D28
  • multiDiffEditor.headerBackground#070a0e
  • panel.border#7ec8e320
  • panelSectionHeader.background#10141c
  • peekViewEditor.background#070a0e
  • peekViewEditor.matchHighlightBackground#7ec8e330
  • peekViewResult.background#10141c
  • scrollbar.shadow#00000080
  • scrollbarSlider.activeBackground#7ec8e3cc
  • scrollbarSlider.background#7ec8e330
  • scrollbarSlider.hoverBackground#7ec8e360
  • settings.focusedRowBackground#7ec8e310
  • settings.headerForeground#EDEEEA
  • sideBar.background#10141c
  • sideBar.foreground#a0a0a0
  • sideBarSectionHeader.background#070a0e
  • sideBarSectionHeader.foreground#7ec8e3
  • statusBar.background#070a0e
  • statusBar.border#79482C50
  • statusBar.debuggingBackground#c0392b
  • statusBar.debuggingBorder#6b1a1a
  • statusBar.debuggingForeground#ffffff
  • statusBar.foreground#a0a0a0
  • statusBar.noFolderBackground#070a0e
  • statusBarItem.hoverBackground#7ec8e320
  • statusBarItem.remoteBackground#7ec8e3
  • statusBarItem.remoteForeground#0a0d12
  • tab.activeBackground#0a0d12
  • tab.activeBorder#7ec8e3
  • tab.activeForeground#EDEEEA
  • tab.border#7ec8e310
  • tab.hoverBackground#7ec8e315
  • tab.inactiveBackground#10141c
  • tab.inactiveForeground#79482C
  • tab.unfocusedHoverBackground#7ec8e310
  • terminal.ansiBlack#0a0d12
  • terminal.ansiBlue#7ec8e3
  • terminal.ansiBrightBlack#79482C
  • terminal.ansiBrightBlue#f0d060
  • terminal.ansiBrightCyan#29b8db
  • terminal.ansiBrightGreen#4ecb71
  • terminal.ansiBrightMagenta#d070f0
  • terminal.ansiBrightRed#e74c3c
  • terminal.ansiBrightWhite#EDEEEA
  • terminal.ansiBrightYellow#7ec8e3
  • terminal.ansiCyan#1a8fa0
  • terminal.ansiGreen#27ae60
  • terminal.ansiMagenta#E67D28
  • terminal.ansiRed#c0392b
  • terminal.ansiWhite#EDEEEA
  • terminal.ansiYellow#E67D28
  • terminal.background#10141c
  • terminal.border#7ec8e320
  • terminal.foreground#EDEEEA
  • terminal.selectionBackground#7ec8e330
  • textBlockQuote.background#070a0e
  • textBlockQuote.border#7ec8e3
  • textLink.foreground#7ec8e3
  • textPreformat.foreground#EDEEEA
  • titleBar.activeBackground#10141c
  • titleBar.activeForeground#a0a0a0
  • titleBar.border#79482C30
  • titleBar.inactiveBackground#070a0e
  • titleBar.inactiveForeground#79482C
  • tree.indentGuidesStroke#7ec8e320
  • walkThrough.embeddedEditorBackground#070a0e
  • welcomePage.buttonHoverBackground#7ec8e325

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
meta.embedded#EDEEEA
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#7ec8e3
variable.other.generic-type.haskell#7ec8e3
storage.type.haskell#7ec8e3
support.variable.magic.python#c0392b
punctuation.separator.period.python,punctuation.separator.element.python,punctuation.parenthesis.begin.python,punctuation.parenthesis.end.python#EDEEEA
variable.parameter.function.language.special.self.python#7ec8e3
variable.parameter.function.language.special.cls.python#7ec8e3
storage.modifier.lifetime.rust#7ec8e3
support.function.std.rust#EDEEEA
entity.name.lifetime.rust#7ec8e3
variable.language.rust#c0392b
support.constant.edge#7ec8e3
constant.other.character-class.regexp#c0392b
keyword.operator.word#7ec8e3
keyword.operator.quantifier.regexp#c0392b
variable.parameter.function#EDEEEA
comment markup.link#2b394f
markup.changed.diff#7ec8e3
meta.diff.header.from-file,meta.diff.header.to-file,punctuation.definition.from-file.diff,punctuation.definition.to-file.diff#7ec8e3
markup.inserted.diff#7ec8e3
markup.deleted.diff#c0392b
meta.function.c,meta.function.cpp#EDEEEA
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#EDEEEA
punctuation.separator.key-value#EDEEEA
keyword.operator.expression.import#7ec8e3
support.constant.math#7ec8e3
support.constant.property.math#7ec8e3
variable.other.constant#7ec8e3
storage.type.annotation.java, storage.type.object.array.java#7ec8e3
source.java#EDEEEA
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#79482C
meta.method.java#79482C
storage.modifier.import.java,storage.type.java,storage.type.generic.java#7ec8e3
keyword.operator.instanceof.java#7ec8e3
meta.definition.variable.name.java#EDEEEA
keyword.operator.arithmetic,keyword.operator.comparison,keyword.operator.decrement,keyword.operator.increment,keyword.operator.relational#7ec8e3
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#7ec8e3
punctuation.separator.delimiter#EDEEEA
punctuation.separator.c,punctuation.separator.cpp#EDEEEA
support.type.posix-reserved.c,support.type.posix-reserved.cpp#7ec8e3
keyword.operator.sizeof.c,keyword.operator.sizeof.cpp#7ec8e3
variable.parameter.function.language.python#EDEEEA
support.type.python#7ec8e3
keyword.operator.logical.python#7ec8e3
variable.parameter.function.python#EDEEEA
punctuation.definition.arguments.begin.python,punctuation.definition.arguments.end.python,punctuation.separator.arguments.python,punctuation.definition.list.begin.python,punctuation.definition.list.end.python#EDEEEA
meta.function-call.generic.python#79482C
constant.character.format.placeholder.other.python#7ec8e3
keyword.operator#7ec8e3
keyword.operator.assignment.compound#7ec8e3
keyword.operator.assignment.compound.js,keyword.operator.assignment.compound.ts#7ec8e3
keyword#7ec8e3
entity.name.namespace#E67D28
variable#EDEEEA
variable.c#EDEEEA
variable.language#7ec8e3
token.variable.parameter.java#EDEEEA
import.storage.java#7ec8e3
token.package.keyword#7ec8e3
token.package#7ec8e3
entity.name.function, meta.require, support.function.any-method, variable.function#79482C
entity.name.type.namespace#E67D28
support.class, entity.name.type.class#E67D28
entity.name.class.identifier.namespace.type#E67D28
entity.name.class, variable.other.class.js, variable.other.class.ts#E67D28
variable.other.class.php#E67D28
entity.name.type#E67D28
keyword.control#7ec8e3
control.elements, keyword.operator.less#7ec8e3
keyword.other.special-method#79482C
storage#7ec8e3
token.storage#7ec8e3
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#7ec8e3
token.storage.type.java#7ec8e3
support.function#EDEEEA
support.type.property-name#EDEEEA
support.type.property-name.toml, support.type.property-name.table.toml, support.type.property-name.array.toml#7ec8e3
support.constant.property-value#EDEEEA
support.constant.font-name#7ec8e3
meta.tag#EDEEEA
string#E67D28
constant.other.symbol#7ec8e3
constant.numeric#7ec8e3
constant#7ec8e3
punctuation.definition.constant#7ec8e3
entity.name.tag#E67D28
entity.other.attribute-name#EDEEEA
entity.other.attribute-name.id#7ec8e3
entity.other.attribute-name.class.css#7ec8e3
meta.selector#7ec8e3
markup.heading#c0392b
markup.heading punctuation.definition.heading, entity.name.section#7ec8e3
keyword.other.unit#7ec8e3
markup.bold,todo.bold#EDEEEA
punctuation.definition.bold#7ec8e3
markup.italic, punctuation.definition.italic,todo.emphasis#7ec8e3
emphasis md#7ec8e3
entity.name.section.markdown#c0392b
punctuation.definition.heading.markdown#c0392b
punctuation.definition.list.begin.markdown#7ec8e3
markup.heading.setext#c0392b
punctuation.definition.bold.markdown#EDEEEA
markup.inline.raw.markdown#7ec8e3
markup.inline.raw.string.markdown#7ec8e3
punctuation.definition.raw.markdown#7ec8e3
punctuation.definition.list.markdown#7ec8e3
punctuation.definition.string.begin.markdown, punctuation.definition.string.end.markdown, punctuation.definition.metadata.markdown#7ec8e3
beginning.punctuation.definition.list.markdown#7ec8e3
punctuation.definition.metadata.markdown#7ec8e3
markup.underline.link.markdown,markup.underline.link.image.markdown#7ec8e3
string.other.link.title.markdown,string.other.link.description.markdown#EDEEEA
markup.raw.monospace.asciidoc#7ec8e3
punctuation.definition.asciidoc#7ec8e3
markup.list.asciidoc#7ec8e3
markup.link.asciidoc,markup.other.url.asciidoc#7ec8e3
string.unquoted.asciidoc,markup.other.url.asciidoc#E67D28
string.regexp#c0392b
punctuation.section.embedded, variable.interpolation#c0392b
punctuation.section.embedded.begin,punctuation.section.embedded.end#7ec8e3
invalid.illegal#c0392b
invalid.illegal.bad-ampersand.html#c0392b
invalid.illegal.unrecognized-tag.html#c0392b
invalid.broken#c0392b
invalid.deprecated#c0392b
invalid.deprecated.entity.other.attribute-name.html#c0392b
invalid.unimplemented#c0392b
source.json meta.structure.dictionary.json > string.quoted.json#E67D28
source.json meta.structure.dictionary.json > string.quoted.json > punctuation.string#E67D28
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#E67D28
source.json meta.structure.dictionary.json > constant.language.json,source.json meta.structure.array.json > constant.language.json#7ec8e3
support.type.property-name.json#c0392b
support.type.property-name.json punctuation#c0392b
text.html.laravel-blade source.php.embedded.line.html entity.name.tag.laravel-blade#E67D28
text.html.laravel-blade source.php.embedded.line.html support.constant.laravel-blade#7ec8e3
support.other.namespace.use.php,support.other.namespace.use-as.php,entity.other.alias.php,meta.interface.php#7ec8e3
keyword.operator.error-control.php#7ec8e3
keyword.operator.type.php#7ec8e3
punctuation.section.array.begin.php#EDEEEA
punctuation.section.array.end.php#EDEEEA
invalid.illegal.non-null-typehinted.php#c0392b
storage.type.php,meta.other.type.phpdoc.php,keyword.other.type.php,keyword.other.array.phpdoc.php#7ec8e3
meta.function-call.php,meta.function-call.object.php,meta.function-call.static.php#79482C
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#7ec8e3
support.constant.core.rust#7ec8e3
support.constant.ext.php,support.constant.std.php,support.constant.core.php,support.constant.parser-token.php#7ec8e3
entity.name.goto-label.php,support.other.php#7ec8e3
keyword.operator.logical.php,keyword.operator.bitwise.php,keyword.operator.arithmetic.php#7ec8e3
keyword.operator.regexp.php#c0392b
keyword.operator.comparison.php#7ec8e3
keyword.operator.heredoc.php,keyword.operator.nowdoc.php#7ec8e3
meta.function.decorator.python#7ec8e3
support.token.decorator.python,meta.function.decorator.identifier.python#7ec8e3
function.parameter#EDEEEA
function.brace#EDEEEA
function.parameter.ruby, function.parameter.cs#EDEEEA
constant.language.symbol.ruby#7ec8e3
constant.language.symbol.hashkey.ruby#7ec8e3
rgb-value#7ec8e3
inline-color-decoration rgb-value#EDEEEA
less rgb-value#EDEEEA
selector.sass#c0392b
support.type.primitive.ts,support.type.builtin.ts,support.type.primitive.tsx,support.type.builtin.tsx#7ec8e3
block.scope.end,block.scope.begin#EDEEEA
storage.type.cs#7ec8e3
entity.name.variable.local.cs#EDEEEA
token.info-token#7ec8e3
token.warn-token#7ec8e3
token.error-token#c0392b
token.debug-token#7ec8e3
punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.section.embedded#7ec8e3
meta.template.expression#EDEEEA
keyword.operator.module#7ec8e3
support.type.type.flowtype#7ec8e3
support.type.primitive#7ec8e3
meta.property.object#EDEEEA
variable.parameter.function.js#EDEEEA
keyword.other.template.begin#7ec8e3
keyword.other.template.end#7ec8e3
keyword.other.substitution.begin#7ec8e3
keyword.other.substitution.end#7ec8e3
keyword.operator.assignment#7ec8e3
keyword.operator.assignment.go#7ec8e3
keyword.operator.arithmetic.go, keyword.operator.address.go#7ec8e3
keyword.operator.arithmetic.c, keyword.operator.arithmetic.cpp#7ec8e3
entity.name.package.go#7ec8e3
support.type.prelude.elm#7ec8e3
support.constant.elm#7ec8e3
punctuation.quasi.element#7ec8e3
constant.character.entity#7ec8e3
entity.other.attribute-name.pseudo-element, entity.other.attribute-name.pseudo-class#7ec8e3
entity.global.clojure#7ec8e3
meta.symbol.clojure#EDEEEA
constant.keyword.clojure#7ec8e3
meta.arguments.coffee, variable.parameter.function.coffee#79482C
source.ini#EDEEEA
meta.scope.prerequisites.makefile#c0392b
source.makefile#7ec8e3
storage.modifier.import.groovy#7ec8e3
meta.method.groovy#79482C
meta.definition.variable.name.groovy#EDEEEA
meta.definition.class.inherited.classes.groovy#7ec8e3
support.type.texture.hlsl, support.type.sampler.hlsl, support.type.object.hlsl, support.type.object.rw.hlsl, support.type.fx.hlsl#7ec8e3
text.variable, text.bracketed#EDEEEA
support.type.swift, support.type.vb.asp#7ec8e3
entity.name.label.cs, entity.name.scope-resolution.function.call, entity.name.scope-resolution.function.definition#EDEEEA
entity.name.label.cs, markup.heading.setext.1.markdown, markup.heading.setext.2.markdown#c0392b
meta.brace.square#EDEEEA
comment, punctuation.definition.comment#2b394fitalic
markup.quote.markdown#2b394f
punctuation.definition.block.sequence.item.yaml#EDEEEA
constant.language.symbol.elixir, constant.language.symbol.double-quoted.elixir#7ec8e3
entity.name.variable.parameter.cs#EDEEEA
entity.name.variable.field.cs#EDEEEA
markup.deleted#c0392b
markup.inserted#7ec8e3
markup.underlineunderline
punctuation.section.embedded.begin.php, punctuation.section.embedded.end.php#7ec8e3
support.other.namespace.php#7ec8e3
variable.parameter.function.latex#EDEEEA
variable.other.object#EDEEEA
variable.other.constant.property#7ec8e3
entity.other.inherited-class#7ec8e3
variable.other.readwrite.c#EDEEEA
entity.name.variable.parameter.php,punctuation.separator.colon.php,constant.other.php#EDEEEA
constant.numeric.decimal.asm.x86_64#7ec8e3
support.other.parenthesis.regexp#c0392b
constant.character.escape#7ec8e3
string.regexp#c0392b
log.info#7ec8e3
log.warning#7ec8e3
log.error#c0392b
keyword.operator.expression.is#7ec8e3
entity.name.label#7ec8e3
support.class.math.block.environment.latex, constant.other.general.math.tex#E67D28
constant.character.math.tex#7ec8e3
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
markup.italic.markdownitalic