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#181A1F
  • activityBar.foreground#ffe4c4
  • activityBarBadge.background#4d78cc
  • activityBarBadge.foreground#f8fafd
  • badge.background#181A1F
  • button.background#404754
  • debugToolBar.background#181A1F
  • diffEditor.insertedTextBackground#00809b33
  • dropdown.background#1d1f23
  • dropdown.border#181a1f
  • editor.background#181A1F
  • editor.findMatchBackground#42557b
  • editor.findMatchBorder#457dff
  • editor.findMatchHighlightBackground#314365
  • editor.foreground#abb2bf
  • editor.lineHighlightBackground#2c313c
  • editor.selectionBackground#67769660
  • editor.selectionHighlightBackground#ffffff10
  • editor.selectionHighlightBorder#dddddd
  • editor.wordHighlightBackground#484e5b
  • editor.wordHighlightBorder#7f848e
  • editor.wordHighlightStrongBackground#abb2bf26
  • editor.wordHighlightStrongBorder#7f848e
  • editorBracketHighlight.foreground2#FE7AB2
  • editorBracketHighlight.foreground3#CC8ECD
  • editorBracketMatch.background#515a6b
  • editorBracketMatch.border#515a6b
  • editorCursor.background#ffffffc9
  • editorCursor.foreground#528bff
  • editorError.foreground#c24038
  • editorGroup.border#181a1f
  • editorGroup.emptyBackground#181a1f
  • editorGroupHeader.tabsBackground#181A1F
  • editorHoverWidget.background#181A1F
  • editorHoverWidget.border#181a1f
  • editorIndentGuide.activeBackground#c8c8c859
  • editorIndentGuide.background#3b4048
  • editorLineNumber.activeForeground#737984
  • editorLineNumber.foreground#495162
  • editorMarkerNavigation.background#181A1F
  • editorRuler.foreground#abb2bf26
  • editorSuggestWidget.background#181A1F
  • editorSuggestWidget.border#181a1f
  • editorSuggestWidget.selectedBackground#2c313a
  • editorWarning.foreground#d19a66
  • editorWhitespace.foreground#3b4048
  • editorWidget.background#181A1F
  • focusBorder#181A1F
  • input.background#1d1f23
  • list.activeSelectionBackground#2c313a
  • list.activeSelectionForeground#d7dae0
  • list.focusBackground#383e4a
  • list.highlightForeground#c5c5c5
  • list.hoverBackground#292d35
  • list.inactiveSelectionBackground#2c313a
  • list.inactiveSelectionForeground#d7dae0
  • list.warningForeground#d19a66
  • menu.foreground#c8c8c8
  • peekViewEditor.background#1b1d23
  • peekViewEditor.matchHighlightBackground#29244b
  • peekViewResult.background#22262b
  • scrollbarSlider.activeBackground#747d9180
  • scrollbarSlider.background#4e566660
  • scrollbarSlider.hoverBackground#5a637580
  • sideBar.background#181A1F
  • sideBarSectionHeader.background#181A1F
  • statusBar.background#181A1F
  • statusBar.debuggingBackground#7e0097
  • statusBar.debuggingBorder#66017a
  • statusBar.debuggingForeground#ffffff
  • statusBar.foreground#9da5b4
  • statusBar.noFolderBackground#181A1F
  • statusBarItem.hoverBackground#2c313a
  • statusBarItem.remoteBackground#517bce
  • statusBarItem.remoteForeground#f8fafd
  • tab.activeBackground#181A1F
  • tab.activeBorderTop#ffe4c4
  • tab.activeForeground#dcdcdc
  • tab.border#181A1F
  • tab.hoverBackground#323842
  • tab.inactiveBackground#181A1F
  • tab.unfocusedHoverBackground#323842
  • terminal.ansiBlack#3f4451
  • terminal.ansiBlue#4aa5f0
  • terminal.ansiBrightBlack#4f5666
  • terminal.ansiBrightBlue#4dc4ff
  • terminal.ansiBrightCyan#4cd1e0
  • terminal.ansiBrightGreen#a5e075
  • terminal.ansiBrightMagenta#de73ff
  • terminal.ansiBrightRed#ff616e
  • terminal.ansiBrightWhite#ffffff
  • terminal.ansiBrightYellow#f0a45d
  • terminal.ansiCyan#42b3c2
  • terminal.ansiGreen#8cc265
  • terminal.ansiMagenta#c162de
  • terminal.ansiRed#e05561
  • terminal.ansiWhite#e6e6e6
  • terminal.ansiYellow#d18f52
  • terminal.background#181A1F
  • terminal.border#abb2bf
  • terminal.foreground#abb2bf
  • terminal.selectionBackground#abb2bf30
  • textLink.foreground#61afef
  • titleBar.activeBackground#181A1F
  • titleBar.activeForeground#9da5b4
  • titleBar.inactiveBackground#181A1F
  • titleBar.inactiveForeground#6b717d

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

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