Skip to main content
Coding Theme

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#0a121c
  • activityBar.border#1c304a
  • activityBarBadge.background#007acc
  • contrastActiveBorder#4dddff
  • editor.background#0a121c
  • editor.foreground#ECECEC
  • editor.inactiveSelectionBackground#3a3d41
  • editor.selectionBackground#315482
  • editor.selectionHighlightBackground#add6ff26
  • editorGroupHeader.tabsBackground#0a121c
  • editorIndentGuide.activeBackground#707070
  • editorIndentGuide.background#404040
  • editorLineNumber.activeForeground#00AA00
  • focusBorder#00AA00
  • input.placeholderForeground#a6a6a6
  • list.dropBackground#383b3d
  • list.hoverBackground#32445c
  • list.inactiveSelectionBackground#315482
  • menu.background#252526
  • menu.foreground#cccccc
  • notifications.background#152438
  • settings.numberInputBackground#292929
  • settings.textInputBackground#292929
  • sideBar.background#152438
  • sideBar.foreground#ffffff
  • sideBarTitle.foreground#bbbbbb
  • tab.activeBackground#315482
  • tab.inactiveBackground#152438

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
emphasisitalic
strongbold
header#000080
comment#807D67
constant.language#6bb9f0
constant.numeric#c8f7c5
constant.regexp#9370db
entity.name.tag.html, entity.name.tag.other.html, entity.name.tag.block.any.html, meta.tag.inline.any.html, entity.name.tag.localname.xml, entity.name.tag.xml#00bFFF
entity.other.attribute-name.html, entity.other.attribute-name.xml, entity.other.attribute-name.localname.xml#1E8BC3
punctuation.definition.tag.xml, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, meta.tag.preprocessor.xml#FEFEFE
entity.name.tag.css#f9bf3b
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.attribute.scss, entity.other.attribute-name.scss#d7ba7d
invalid#FF4500
constant.language.boolean.true.js, constant.language.boolean.false.js, constant.language.boolean.true.ts, constant.language.boolean.false.ts, constant.language.boolean.true.apex, constant.language.boolean.false.apex#19B5FE
meta.decorator.jsitalic
meta.import.js, meta.export.js, meta.import.ts, meta.export.ts#1E90FF
keyword.control.import.js, keyword.control.from.js, keyword.control.export.js, keyword.control.conditional, keyword.type.apex, keyword.other.class.apex, keyword.control.import.ts, keyword.control.export.ts#52B3D9
keyword.operator.query, keyword.operator.assignment, keyword.operator.conditional.colon, keyword.operator.comparison, keyword.operator.relational, keyword.operator.arithmetic, keyword.operator.increment, keyword.operator.decrement, keyword.operator.iterator.colon.apex#e4f1feitalic bold
keyword.query.field#e4f1fe
entity.other.inherited-class.js, entity.name.type.class.js, sharing.modifier.apex#00A4A6
meta.definition.method.js, meta.method.declaration.js, meta.function-call.js, meta.function-call.ts, entity.name.function.apex, meta.function.expression.ts#00BFFF
variable.parameter.js, meta.parameters.js, meta.objectliteral.js, meta.block.js, meta.block.ts, entity.name.variable.parameter.apex, meta.definition.variable.ts, variable.other.object.ts, meta.var.expr.ts, variable.other.readwrite.ts, meta.var.expr.ts#E0FFFF
variable.other.constant.js, variable.object.property.js, variable.other.object.js, variable.other.property.js, variable.other.readwrite.js, variable.language.this.js, entity.name.variable.local.apex, variable.other.readwrite.apex, entity.name.variable.property.apex, entity.name.variable.field.apex, variable.other.object.apex, variable.object.readwrite.apex, variable.other.object.property.apex#e4f1fe
punctuation.squarebracket.close.apex, punctuation.squarebracket.open.apex, punctuation.parenthesis.open.apex, punctuation.parenthesis.close.apex, punctuation.definition.typeparameters.begin.apex, punctuation.definition.typeparameters.end.apex, punctuation.curlybrace.close.apex, punctuation.curlybrace.open.apex, punctuation.accessor.apex, punctuation.terminator.statement.apex, punctuation.accessor.js, meta.brace.round.js, meta.brace.square.js, punctuation.definition.block.js, punctuation.terminator.statement.js, punctuation.separator.comma.js, punctuation.separator.key-value.js#FEFEFE
markup.underlineunderline
markup.bold#1E90FFbold
markup.heading#1E90FFbold
markup.italicitalic
markup.inserted#c8f7c5
markup.deleted#f1a9a0
markup.changed#52b3d9
punctuation.definition.quote.begin.markdown#87d37c
punctuation.definition.list.begin.markdown#6495ed
markup.inline.raw#f1a9a0
meta.preprocessor#7bacdd
meta.preprocessor.string#ffecdb
meta.preprocessor.numeric#c8f7c5
meta.structure.dictionary.key.python#e4f1fe
meta.diff.header#1E90FF
storage#1E90FF
storage.type#1E90FF
storage.modifier#1E90FF
string#ffecdb
string.tag#ffecdb
string.value#ffecdb
string.regexp#ff7f50
punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.section.embedded#1E90FF
meta.template.expression#ececec
support.type.vendored.property-name, support.type.property-name, variable.css, variable.scss, variable.other.less, source.coffee.embedded#00e0e0
keyword.operator.new, keyword.operator.expression, keyword.operator.cast, keyword.operator.sizeof, keyword.operator.instanceof, keyword.operator.logical.python#1E90FF
keyword.other.unit#c8f7c5
punctuation.section.embedded.begin.php, punctuation.section.embedded.end.php#1E90FF
support.function.git-rebase#e4f1fe
constant.sha.git-rebase#c8f7c5
storage.modifier.import.java, variable.language.wildcard.java, storage.modifier.package.java#ECECEC
variable.language#1E90FF
token.info-token#6495ED
token.warn-token#f7ca18
token.error-token#FF4500
token.debug-token#BF5EEC
string#ADD8E6
keyword - keyword.operator#1E8BC3
keyword.control#1E8BC3
storage#1E8BC3
storage.type#1E8BC3
constant.numeric#DADFE1
entity.name.type#00b5b5
entity.name.class#00b5b5
support.type#00b5b5
support.class#00b5b5
support.function#00BFFF

Shiki preview

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

Loading...

Codey Midnight - Coding Theme