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#323336
  • activityBar.inactiveForeground#cfcfcf9c
  • activityBarBadge.background#007ACC
  • editor.background#1E1E1E
  • editor.findMatchBackground#1B5227
  • editor.findMatchHighlightBackground#501f36
  • editor.foreground#D4D4D4
  • editor.inactiveSelectionBackground#3A3D41
  • editor.lineHighlightBackground#2e2e2e
  • editor.selectionBackground#3362b3c2
  • editor.selectionHighlightBackground#ADD6FF26
  • editorBracketMatch.background#036128
  • editorBracketMatch.border#00ff0000
  • editorCursor.foreground#ff8d03
  • editorGroup.border#27537c8f
  • editorGutter.foldingControlForeground#db8d33
  • editorIndentGuide.activeBackground#707070
  • editorIndentGuide.background#404040
  • editorLineNumber.activeForeground#FE8100
  • editorWidget.resizeBorder#21d42ace
  • input.border#3c8ec5
  • input.placeholderForeground#A6A6A6
  • list.activeSelectionBackground#195094
  • list.dropBackground#383B3D
  • list.focusBackground#243a53
  • list.hoverBackground#2c455f
  • menu.background#252526
  • menu.foreground#CCCCCC
  • panel.border#ff8d03
  • ports.iconRunningProcessForeground#369432
  • sideBarSectionHeader.background#383a3d
  • sideBarSectionHeader.border#ccc3
  • sideBarTitle.foreground#BBBBBB
  • statusBar.background#404040
  • statusBar.foreground#ecebeb
  • statusBarItem.remoteBackground#16825D
  • statusBarItem.remoteForeground#FFF
  • tab.activeBackground#313e52
  • tab.activeBorder#ff8d03
  • tab.border#3a3d3f
  • tab.hoverBackground#293238
  • tab.inactiveBackground#272829
  • tab.lastPinnedBorder#ccc3
  • tab.unfocusedActiveBackground#2b323b
  • tab.unfocusedActiveBorder#97a7c8
  • titleBar.border#93a7cb33
  • titleBar.inactiveBackground#303640

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
emphasisitalic
strongbold
markup.underlineunderline
markup.italicitalic
header#000080
constant.regexp#646695
invalid#f44747
punctuation.definition.list.begin.markdown#6796e6
punctuation.definition.tag#808080
comment#6A9955
punctuation.definition.quote.begin.markdown#6A9955
entity.name.label#C0A649
entity.other.attribute-name.class.mixin.css, entity.other.attribute-name.id.css, entity.other.attribute-name.parent-selector.css, source.css.less entity.other.attribute-name.id, entity.other.attribute-name.scss#d79e7d
entity.other.attribute-name.class.css#DDB974
entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.pseudo-element.css#B67FFF
keyword.control, source.cpp keyword.operator.new, keyword.operator.delete, keyword.other.using, keyword.other.operator, entity.name.operator#d67797
text.html.derivative#b4c7d8
keyword.operator#d4d4d4
keyword.operator.assignment
source.js, source.cs#d4d4d4
meta.embedded, source.groovy.embedded#b3b3b3
meta.template.expression#b3b3b3
storage.modifier.import.java, variable.language.wildcard.java, storage.modifier.package.java#b3b3b3
variable, meta.definition.variable.name, support.variable, entity.name.variable#81C6E5
support.constant#81C6E5
variable.other.constant, variable.other.enummember#4CAEF3
meta.object-literal.key#65aac7
entity.other.attribute-name#81C6E5
meta.structure.dictionary.key.python#65aac7
support.type.vendored.property-name, support.type.property-name, source.coffee.embedded#81C6E5
variable.css, variable.scss, variable.argument.css, variable.other.less#29B6E5
support.function.git-rebase#65aac7
constant.language#3688cc
constant.character#3688cc
entity.name.tag#569cd6
markup.bold#3688ccbold
markup.heading#3688ccbold
punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.section.embedded#3688cc
keyword#3688cc
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.logical.python, keyword.operator.wordlike#3688cc
punctuation.section.embedded.begin.php, punctuation.section.embedded.end.php#3688cc
variable.language#3688cc
markup.changed#3688cc
meta.preprocessor, entity.name.function.preprocessor#3688cc
meta.diff.header#3688cc
storage#3688cc
storage.type#B67FFF
storage.modifier, keyword.operator.noexcept#3688cc
constant.numeric, keyword.operator.plus.exponent, keyword.operator.minus.exponent#84BB7C
markup.inserted#b5cea8
meta.preprocessor.numeric#b5cea8
keyword.other.unit#C389CB
constant.sha.git-rebase#b5cea8
markup.deleted#ce9178
markup.inline.raw#ce9178
meta.preprocessor.string#ce9178
string, meta.embedded.assembly#ce9178
string.tag#ce9178
string.value#ce9178
support.constant.property-value, support.constant.font-name, support.constant.media-type, support.constant.media, support.constant.color#D97A70
constant.other.color.rgb-value, constant.other.rgb-value#5ea79e
punctuation.definition.group.regexp, punctuation.definition.group.assertion.regexp, punctuation.definition.character-class.regexp, punctuation.character.set.begin.regexp, punctuation.character.set.end.regexp, keyword.operator.negation.regexp, support.other.parenthesis.regexp#CE9178
entity.name.function, support.function, support.constant.handlebars, source.powershell variable.other.member, entity.name.operator.custom-literal#D6C589
keyword.operator.or.regexp, keyword.control.anchor.regexp#c0a649
meta.return-type, support.class, support.type, entity.name.type, entity.name.namespace, entity.other.attribute, entity.name.scope-resolution, entity.name.class, storage.type.numeric.go, storage.type.byte.go, storage.type.boolean.go, storage.type.string.go, storage.type.uintptr.go, storage.type.error.go, storage.type.rune.go, storage.type.cs, storage.type.generic.cs, storage.type.modifier.cs, storage.type.variable.cs, storage.type.annotation.java, storage.type.generic.java, storage.type.java, storage.type.object.array.java, storage.type.primitive.array.java, storage.type.primitive.java, storage.type.token.java, storage.type.groovy, storage.type.annotation.groovy, storage.type.parameters.groovy, storage.type.generic.groovy, storage.type.object.array.groovy, storage.type.primitive.array.groovy, storage.type.primitive.groovy#4EC9B0
meta.type.cast.expr, meta.type.new.expr, support.constant.math, support.constant.dom, support.constant.json, entity.other.inherited-class#4EC9B0
constant.character.character-class.regexp, constant.other.character-class.set.regexp, constant.other.character-class.regexp, constant.character.set.regexp#d16969
string.regexp#d16969
entity.name.tag.css#d7ba7d
keyword.operator.quantifier.regexp#d7ba7d
constant.character.escape#d7ba7d

Shiki preview

TypeScript sample highlighted with this variant's colors and tokenColors.

Loading...

night eyes Theme - Coding Theme