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#2e2d2d
  • activityBarBadge.background#d0663a
  • badge.background#d0663a
  • editor.background#383939
  • editor.foreground#ffffff
  • editor.lineHighlightBackground#2e2d2d
  • editor.selectionBackground#6c99bb33
  • editorCursor.foreground#e6e1dc
  • editorWhitespace.foreground#434343
  • list.activeSelectionBackground#383939
  • list.activeSelectionForeground#ffffff
  • list.hoverBackground#676869
  • list.inactiveSelectionBackground#676869
  • sideBar.background#2e2d2d
  • sideBarSectionHeader.background#2e2d2d
  • statusBar.background#383939
  • statusBar.debuggingBackground#383939
  • statusBar.debuggingBorder#383939
  • statusBar.debuggingForeground#ffffff
  • statusBar.foreground#e6e1dc
  • statusBar.noFolderBackground#383939
  • statusBarItem.hoverBackground#676869
  • statusBarItem.remoteBackground#5286b7
  • statusBarItem.remoteForeground#e6e1dc
  • tab.activeBackground#383939
  • tab.activeForeground#ffffff
  • tab.border#2e2d2d
  • tab.hoverBackground#676869
  • tab.inactiveBackground#2e2d2d
  • tab.unfocusedHoverBackground#676869
  • terminal.ansiBlack#2d3139
  • terminal.ansiBlue#5286b7
  • terminal.ansiBrightBlack#7f848e
  • terminal.ansiBrightBlue#86a9c4
  • terminal.ansiBrightCyan#86a9c4
  • terminal.ansiBrightGreen#b9c87f
  • terminal.ansiBrightMagenta#a97a8c
  • terminal.ansiBrightRed#ac4639
  • terminal.ansiBrightWhite#d9dbfc
  • terminal.ansiBrightYellow#c4bc3c
  • terminal.ansiCyan#86a9c4
  • terminal.ansiGreen#b9c87f
  • terminal.ansiMagenta#a97a8c
  • terminal.ansiRed#ac4639
  • terminal.ansiWhite#d9dbfc
  • terminal.ansiYellow#c4bc3c
  • terminal.foreground#d9dbfc

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
markup.quote.markdown#b9c87f
comment, punctuation.definition.comment#b9a370italic
meta.brace.square#abb2bf
entity.name.label.cs, markup.heading.setext.1.markdown, markup.heading.setext.2.markdown#d19a66
entity.other.attribute-name.pseudo-element, entity.other.attribute-name.pseudo-class#d19a66
constant.character.entity#e06c75
punctuation.quasi.element#c678dd
keyword.operator.assignment#c4bc3c
keyword.other.substitution.end#98c379
keyword.other.substitution.begin#98c379
keyword.other.template.end#98c379
keyword.other.template.begin#98c379
variable.parameter.function.js#e06c75
meta.property.object#e06c75
support.type.primitive#c4bc3c
support.type.type.flowtype#61afef
keyword.operator.module#c678dd
meta.template.expression#abb2bf
punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.section.embedded#c4bc3c
token.debug-token#c678dd
token.error-token#f44747
token.warn-token#d19a66
token.info-token#61afef
block.scope.end,block.scope.begin#abb2bf
support.type.primitive.ts,support.type.builtin.ts,support.type.primitive.tsx,support.type.builtin.tsx#c4bc3c
selector.sass#e06c75
less rgb-value#d19a66
inline-color-decoration rgb-value#d19a66
rgb-value#56b6c2
function.brace#abb2bf
function.parameter#abb2bf
support.token.decorator.python,meta.function.decorator.identifier.python#56b6c2
meta.function.decorator.python#61afef
support.type.property-name.json punctuation#d9dbfc
support.type.property-name.json#d9dbfc
invalid.unimplemented#e6e1dc
invalid.deprecated#e6e1dc
invalid.broken#e6e1dc
invalid.illegal.bad-ampersand.html#e6e1dc
invalid.illegal#e6e1dc
punctuation.section.embedded.begin,punctuation.section.embedded.end#c4bc3c
punctuation.section.embedded, variable.interpolation#e06c75
constant.character.escape#b9c87f
string.regexp#56b6c2
markup.bold.markdown#e5c07bbold
string.other.link.title.markdown,string.other.link.description.markdown,constant.other.reference.link.markdown#cd8d4e
markup.underline.link.markdown,markup.underline.link.image.markdown#b9c87f
punctuation.definition.metadata.markdown#b9c87f
beginning.punctuation.definition.list.markdown#e06c75
punctuation.accessor#c4bc3c
punctuation.definition.string.begin.markdown, punctuation.definition.string.end.markdown, punctuation.definition.metadata.markdown, punctuation.definition.constant.markdown, punctuation.definition.constant.begin.markdown, punctuation.definition.constant.end.markdown#ffffff
punctuation.definition.list.markdown#e06c75
markup.inline.raw.string.markdown#b9c87f
markup.inline.raw.markdown#b9c87f
punctuation.definition.bold.markdown#e5c07b
markup.heading.setext#abb2bf
punctuation.definition.list.begin.markdown#e5c07b
punctuation.definition.heading.markdown#e5c07b
entity.name.section.markdown#e5c07b
emphasis md#c678dd
markup.italic, punctuation.definition.italic,todo.emphasis#e5c07b
punctuation.definition.bold#e5c07b
markup.bold,todo.bold#d19a66bold
keyword.other.unit#5286b7
markup.heading punctuation.definition.heading, entity.name.section#61afef
markup.heading#e06c75
meta.selector#c678dd
entity.other.attribute-name#d19a66
entity.name.tag#f9d08b
punctuation.definition.constant#d19a66
constant#86a9c4
constant.numeric#5286b7
constant.other.symbol#56b6c2
entity.other.inherited-class#d0663a
string#b9c87f
meta.tag#c4bc3c
support.constant.font-name#d19a66
support.constant.property-value#86a9c4
support.type.property-name#d9dbfc
support.function#d1673a
token.storage.type.java#e5c07b
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#cd8d4e
token.storage#c678dd
storage#cd8d4e
storage.modifier#cd8d4e
storage.type.class#fad08b
keyword.other.special-method#61afef
control.elements, keyword.operator.less#d19a66
keyword.control#cd8d4e
entity.name.type#e5c07b
entity.name.class, variable.other.class.js, variable.other.class.ts#e5c07b
entity.name.class.identifier.namespace.type#e5c07b
support.class, entity.name.type.class#d0663a
support.class.component#f9d08b
entity.name.type.namespace#e5c07b
entity.name.function, meta.require, support.function.any-method, variable.function#a97a8c
token.package#abb2bf
token.package.keyword#c678dd
variable.language#e5c07b
variable#d9dbfc
keyword#ac4639
keyword.operator.assignment.compound#c4bc3c
keyword.operator#c4bc3c
constant.character.format.placeholder.other.python#c4bc3c
meta.function-call.generic.python#a97a8c
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
variable.parameter.function.python#d19a66
keyword.operator.logical.python#cd8d4e
support.type.python#d1673a
variable.parameter.function.language.python#d9dbfc
source.python#d9dbfc
punctuation.separator.delimiter#abb2bf
keyword.operator.arithmetic,keyword.operator.comparison,keyword.operator.decrement,keyword.operator.increment,keyword.operator.relational#c4bc3c
support.variable.dom,support.variable.property.dom#e06c75
support.type.object.dom#56b6c2
keyword.operator.delete#c678dd
entity.name.function,support.function.console#a97a8c
support.variable.property.process#d19a66
support.type.object.console#e06c75
keyword.operator.expression.instanceof, keyword.operator.new, keyword.operator.ternary, keyword.operator.optional, keyword.operator.expression.keyof#c4bc3c
support.constant.json#d19a66
variable.other.readwrite,meta.object-literal.key,support.variable.property,support.variable.object.process,support.variable.object.node#d9dbfc
entity.name.type.module#d0663a
support.module.node,support.type.object.module,support.module.node#e5c07b
support.type.vendored.property-name.css#d9dbfc
support.constant.color.w3c-standard-color-name.css#d19a66
punctuation.separator.list.comma.css#ffffff
support.constant.color.w3c-standard-color-name.css,support.constant.color.w3c-standard-color-name.scss#d19a66
keyword.operator.css,keyword.operator.scss,keyword.operator.less#56b6c2
support.constant.property-value.scss,support.constant.property-value.css, support.constant.color.w3c-extended-color-name.css#86a9c4
keyword.operator.channel#56b6c2
keyword.operator.bitwise#56b6c2
keyword.operator.logical#c4bc3c
variable.other.constant#d9dbfc
support.constant.property.math#d19a66
support.constant.math#e5c07b
keyword.operator.expression.import#61afef
punctuation.separator.key-value#c4bc3c
markup.deleted.diff#e06c75
markup.inserted.diff#98c379
meta.diff.header.from-file,punctuation.definition.from-file.diff#61afef
markup.changed.diff#e5c07b
comment markup.link#5c6370
variable.parameter.function#abb2bf
punctuation.definition.string.begin,punctuation.definition.string.end#b9c87f
keyword.operator.quantifier.regexp#9476d4
constant.other.character-class.regexp#b59ce7
support.constant.edge#c678dd
variable.parameter.function.language.special.self.python#e5c07b
punctuation.separator.period.python,punctuation.separator.element.python,punctuation.parenthesis.begin.python,punctuation.parenthesis.end.python,#abb2bf
support.variable.magic.python#e06c75
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
markup.italic.markdown#e5c07bitalic
meta.separator.markdown#e5c07b
comment.line.double-slash,comment.block.documentationitalic
entity.other.attribute-name, 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
Specials Board by Filip Mares - VS Code Theme