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#282828
  • activityBar.foreground#ffffff
  • activityBar.inactiveForeground#52494e
  • activityBarBadge.background#ffdd33
  • activityBarBadge.foreground#000000
  • button.background#ffdd33
  • button.foreground#000000
  • editor.background#181818
  • editor.findMatchBackground#f4f4ff
  • editor.findMatchForeground#0a0a0a
  • editor.findMatchHighlightBackground#8b8989de
  • editor.findMatchHighlightForeground#000000
  • editor.foreground#f4f4ff
  • editor.hoverHighlightBackground#63626231
  • editor.selectionBackground#484848
  • editor.selectionHighlightBackground#484848
  • editor.wordHighlightBackground#00000000
  • editor.wordHighlightStrongBackground#282828
  • editorBracketHighlight.foreground1#bfc5bf
  • editorBracketHighlight.foreground2#bfc5bf
  • editorBracketHighlight.foreground3#bfc5bf
  • editorBracketHighlight.foreground4#bfc5bf
  • editorBracketHighlight.foreground5#bfc5bf
  • editorBracketHighlight.foreground6#bfc5bf
  • editorBracketHighlight.unexpectedBracket.foreground#f43841
  • editorBracketMatch.background#52494e
  • editorBracketMatch.border#00000000
  • editorBracketPairGuide.activeBackground1#282828
  • editorBracketPairGuide.activeBackground2#282828
  • editorBracketPairGuide.activeBackground3#282828
  • editorBracketPairGuide.activeBackground4#282828
  • editorBracketPairGuide.activeBackground5#282828
  • editorBracketPairGuide.activeBackground6#282828
  • editorBracketPairGuide.background1#52494e
  • editorBracketPairGuide.background2#52494e
  • editorBracketPairGuide.background3#52494e
  • editorBracketPairGuide.background4#52494e
  • editorBracketPairGuide.background5#52494e
  • editorBracketPairGuide.background6#52494e
  • editorCursor.foreground#ffdd33
  • editorError.background#00000000
  • editorError.foreground#f43841
  • editorGroupHeader.tabsBackground#181818
  • editorGutter.background#181818
  • editorInfo.background#00000000
  • editorLineNumber.activeForeground#ffdd33
  • editorLineNumber.foreground#7a7076
  • editorLink.activeForeground#96a6c8
  • editorWarning.background#00000000
  • editorWarning.foreground#cc8c3c
  • editorWidget.background#282828
  • sideBar.background#181818
  • statusBar.background#282828
  • statusBar.noFolderBackground#282828
  • statusBar.noFolderForeground#ffffff
  • textLink.activeForeground#96a6c8
  • textLink.foreground#9e95c7
  • titleBar.activeBackground#282828
  • titleBar.border#282828

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
meta.embedded, source.groovy.embedded, string meta.image.inline.markdown#f4f4ff
emphasisitalic
strongbold
header#ffdd33
comment#cc8c3c
constant.language#95A99F
constant, constant.numeric, variable.other.constant, keyword.operator.plus.exponent, keyword.operator.minus.exponent#95a99f
constant.regexp#73c936
entity.name.tag#ffdd33
entity.other.attribute-name#f4f4ff
invalid#f43841
markup.underline#9e95c7underline
markup.bold#9e95c7bold
markup.heading#ffdd33bold
markup.italic#9e95c7italic
markup.strikethrough#9e95c7strikethrough
markup.inserted#73c936
markup.deleted#f43841
markup.changed#ffdd33
punctuation.definition.quote.begin.markdown#cc8c3c
punctuation.definition.list.begin.markdown#ffdd33
markup.inline.raw#73c936
punctuation.definition.tag#b6b6b6
meta.preprocessor, entity.name.function.preprocessor#ffdd33
meta.preprocessor.string#73c936
meta.preprocessor.numeric#95a99f
meta.diff.header#ffdd33
storage#ffdd33
storage.type#ffdd33
storage.modifier, keyword.operator.noexcept#ffdd33
string, meta.embedded.assembly#73c936
string.tag#73c936
string.value#73c936
string.regexp#73c936
punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.section.embedded#ffdd33
meta.template.expression#f4f4ff
keyword#ffdd33
keyword.control#ffdd33
keyword.operator#ffdd33
keyword.operator.new, keyword.operator.expression, keyword.operator.cast, keyword.operator.sizeof, keyword.operator.alignof, keyword.operator.typeid, keyword.operator.alignas, keyword.operator.instanceof, keyword.operator.wordlike#ffdd33
keyword.other.unit#95a99f
variable, variable.other.readwrite, variable.other.enummember, variable.other.metavariable.name#f4f4ff
entity.name.function#f4f4ff
meta.function-call#f4f4ff
entity.name.function.member#f4f4ff
support.function#f4f4ff
support.type#b6b6b6
support.class#b6b6b6
meta.object-literal.key#f4f4ff
variable.other.property#f4f4ff
entity.name.type, entity.other.inherited-class, entity.name.type.primitive, entity.name.type.numeric, storage.type.primitive#b6b6b6
token.info-token#6796E6
token.warn-token#CD9731
token.debug-token#B267E6
keyword.constant.bool.zig, keyword.constant.default.zig#95a99f
keyword.type.zig, keyword.type.integer.zig, keyword.type.c.zig#b6b6b6
entity.name.tag.css#ffdd33
entity.other.attribute-name.class.css, entity.other.attribute-name.class.mixin.css, entity.other.attribute-name.id.css, entity.other.attribute-name.parent-selector.css, entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.pseudo-element.css, source.css.less entity.other.attribute-name.id, entity.other.attribute-name.scss#ffdd33
support.type.vendored.property-name, support.type.property-name, variable.css, variable.scss, variable.other.less, source.coffee.embedded#f4f4ff
meta.structure.dictionary.key.python#f4f4ff
keyword.operator.logical.python#ffdd33
support.variable.magic.python, support.function.magic.python, meta.function.decorator.python#b6b6b6
storage.modifier.import.java, variable.language.wildcard.java, storage.modifier.package.java#e4e4ef
storage.type.annotation.java, punctuation.definition.annotation.java, storage.type.java, storage.type.generic.java, storage.type.object.array.java#b6b6b6
entity.name.function.preprocessor.c, entity.name.function.preprocessor.cpp#e4e4ef
storage.modifier.array.bracket.square.c, storage.modifier.array.bracket.square.cpp#e4e4ef
storage.type.built-in.primitive.cpp, storage.type.built-in.primitive.c#b6b6b6
support.type.property-name.json#e4e4ef
entity.name.tag.yaml#e4e4ef
meta.tag.metadata.doctype.html#b6b6b6
meta.tag.xml, entity.name.tag.html, meta.tag.table.toml#ffdd33
punctuation.section.embedded.begin.php, punctuation.section.embedded.end.php#ffdd33
support.function.git-rebase#f4f4ff
constant.sha.git-rebase#95a99f
storage.type.string.go, storage.type.int.go, storage.type.error.go, storage.type.byte.go, storage.type.numeric.go, storage.type.boolean.go, storage.type.rune.go, storage.type.uintptr.go#b6b6b6
entity.name.type.result, entity.name.type.option#ffdd33
variable.other.metavariable.specifier#ffdd33
entity.name.function.ts, entity.name.function.js#f4f4ff
storage.type.function.arrow#ffdd33
support.class.component.tsx, support.class.component.jsx#b6b6b6
variable.other.normal.shell#f4f4ff
support.function.builtin.shell#f4f4ff
keyword.other.sql#ffdd33
entity.name.function.sql#f4f4ff
markup.fenced_code.block.markdown#f4f4ff
string.other.link.title.markdown#73c936
keyword.other.cmake#ffdd33
entity.name.function.cmake#f4f4ff
variable.other.cmake#f4f4ff
string.quoted.double.cmake, string.quoted.single.cmake#73c936
support.constant.property-value.css, support.constant.color.w3c-standard-color-name.css, entity.name.type.lifetime, keyword.other.unit.hexadecimal#9e95c7
storage.modifier.array#e4e4ef
support.type.julia#b6b6b6
variable.language#ffdd33
ThemeDatabase All Themes by enes ozturk - VS Code Theme