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#252a41
  • activityBar.border#1b1f32
  • activityBar.dropBackground#8b9efd40
  • activityBar.foreground#a6aab9
  • activityBarBadge.background#4961da
  • activityBarBadge.foreground#e1e6ff
  • badge.background#4961da
  • badge.foreground#e1e6ff
  • breadcrumbPicker.background#131520
  • button.background#4961da
  • button.foreground#e1e6ff
  • button.hoverBackground#516aec
  • debugExceptionWidget.background#131520
  • debugExceptionWidget.border#131520
  • debugToolBar.background#131520
  • debugToolBar.border#1b1f32
  • descriptionForeground#c3cdfe
  • diffEditor.insertedTextBackground#4961da
  • diffEditor.insertedTextBorder#4961da
  • diffEditor.removedTextBackground#4961da
  • diffEditor.removedTextBorder#4961da
  • dropdown.background#252a41
  • dropdown.border#1b1f32
  • dropdown.foreground#e1e6ff
  • editor.background#1b1f32
  • editor.findMatchBackground#444b6f80
  • editor.findMatchHighlightBackground#51587b80
  • editor.foreground#a6aab9
  • editor.hoverHighlightBackground#444b6f
  • editor.inactiveSelectionBackground#5e6587
  • editor.lineHighlightBackground#252a41
  • editor.rangeHighlightBackground#252a41
  • editor.selectionBackground#252a41
  • editor.selectionHighlightBackground#252a41
  • editor.wordHighlightBackground#252a41
  • editor.wordHighlightStrongBackground#252a41
  • editorBracketMatch.background#131520
  • editorBracketMatch.border#5e6587
  • editorCodeLens.foreground#a6aab9
  • editorCursor.background#1b1f32
  • editorCursor.foreground#7289fd
  • editorError.foreground#516aec
  • editorGroup.background#5e6587
  • editorGroup.border#131520
  • editorGroup.dropBackground#67c9e440
  • editorGroupHeader.noTabsBackground#252a41
  • editorGroupHeader.tabsBackground#252a41
  • editorGroupHeader.tabsBorder#131520
  • editorGutter.addedBackground#252a41
  • editorGutter.background#13152064
  • editorGutter.deletedBackground#289dbd
  • editorGutter.modifiedBackground#627af4
  • editorHoverWidget.background#131520
  • editorHoverWidget.border#131520
  • editorIndentGuide.activeBackground#444b6f
  • editorIndentGuide.background#252a41
  • editorLineNumber.activeForeground#9094a7
  • editorLineNumber.foreground#444b6fE6
  • editorMarkerNavigation.background#252a41
  • editorMarkerNavigationError.background#4961da
  • editorMarkerNavigationWarning.background#627af4
  • editorOverviewRuler.commonContentForeground#7289fd
  • editorOverviewRuler.currentContentForeground#7289fd
  • editorOverviewRuler.incomingContentForeground#7289fd
  • editorRuler.foreground#a6aab9
  • editorSuggestWidget.background#252a41
  • editorSuggestWidget.border#131520
  • editorSuggestWidget.foreground#cbd4d7
  • editorSuggestWidget.highlightForeground#99e9ff
  • editorSuggestWidget.selectedBackground#131520
  • editorWarning.foreground#627af4
  • editorWhitespace.foreground#5e6587
  • editorWidget.background#131520
  • editorWidget.border#131520
  • errorForeground#4961da
  • extensionButton.prominentBackground#4961da
  • extensionButton.prominentForeground#e1e6ff
  • extensionButton.prominentHoverBackground#4961da
  • focusBorder#444b6f80
  • foreground#a6aab9
  • gitDecoration.addedResourceForeground#a5b3fe
  • gitDecoration.conflictingResourceForeground#627af4
  • gitDecoration.deletedResourceForeground#289dbd
  • gitDecoration.ignoredResourceForeground#444b6f
  • gitDecoration.modifiedResourceForeground#67c9e4
  • gitDecoration.untrackedResourceForeground#f9fbfb
  • input.background#252a41
  • input.border#444b6f
  • input.foreground#c3cdfe
  • input.placeholderForeground#a6aab9
  • inputOption.activeBorder#67c9e4
  • inputValidation.errorBackground#4961da
  • inputValidation.errorBorder#4961da
  • inputValidation.infoBackground#1b1f32
  • inputValidation.infoBorder#516aec
  • inputValidation.warningBackground#627af4
  • inputValidation.warningBorder#627af4
  • list.activeSelectionBackground#444b6fBF
  • list.activeSelectionForeground#c3cdfe
  • list.dropBackground#67c9e440
  • list.errorForeground#7289fd
  • list.focusBackground#252a41
  • list.focusForeground#75d5f0
  • list.highlightForeground#75d5f0
  • list.hoverBackground#252a41
  • list.hoverForeground#75d5f0
  • list.inactiveSelectionBackground#252a41
  • list.inactiveSelectionForeground#797e96
  • list.invalidItemForeground#7289fd
  • list.warningForeground#7289fd
  • merge.currentHeaderBackground#5e6587
  • merge.incomingHeaderBackground#516aec
  • meta.objectliteral.js#516aec
  • notificationLink.foreground#67c9e4
  • notifications.background#131520
  • notifications.foreground#c3cdfe
  • panel.background#131520
  • panel.border#131520
  • panel.dropBackground#8b9efd40
  • panelTitle.activeBorder#51587b
  • panelTitle.activeForeground#e1e6ff
  • panelTitle.inactiveForeground#797e96
  • peekView.border#252a41
  • peekViewEditor.background#1b1f32
  • peekViewEditor.matchHighlightBackground#4961da
  • peekViewResult.background#1b1f32
  • peekViewResult.fileForeground#9094a7
  • peekViewResult.lineForeground#51587b
  • peekViewResult.matchHighlightBackground#4961da
  • peekViewResult.selectionBackground#252a41
  • peekViewResult.selectionForeground#a6aab9
  • peekViewTitle.background#131520
  • peekViewTitleDescription.foreground#797e96
  • peekViewTitleLabel.foreground#9094a7
  • pickerGroup.border#131520
  • pickerGroup.foreground#c3cdfe
  • progress.background#5e6587
  • progressBar.background#627af4
  • punctuation.definition.generic.begin.html#7289fd
  • scrollbar.shadow#131520
  • scrollbarSlider.activeBackground#51587b
  • scrollbarSlider.background#252a41
  • scrollbarSlider.hoverBackground#444b6f
  • selection.background#627af4
  • sideBar.background#131520
  • sideBar.border#1b1f3280
  • sideBar.dropBackground#8b9efd40
  • sideBar.foreground#797e96
  • sideBarSectionHeader.background#252a41
  • sideBarSectionHeader.foreground#a6aab9
  • sideBarTitle.foreground#a6aab9
  • source.elm#5e6587
  • statusBar.background#1b1f32
  • statusBar.border#252a41
  • statusBar.debuggingBackground#1b1f32
  • statusBar.debuggingBorder#1b1f32
  • statusBar.foreground#5e6587
  • statusBar.noFolderBackground#1b1f32
  • statusBar.noFolderBorder#252a41
  • statusBarItem.activeBackground#5e6587
  • statusBarItem.hoverBackground#252a41
  • statusBarItem.prominentBackground#252a41
  • statusBarItem.prominentHoverBackground#252a41
  • string.quoted.single.js#99e9ff
  • tab.activeBackground#1b1f32
  • tab.activeBorder#131520
  • tab.activeForeground#e1e6ff
  • tab.border#1b1f32
  • tab.hoverBackground#1b1f32
  • tab.inactiveBackground#252a41
  • tab.inactiveForeground#797e96
  • tab.unfocusedActiveBorder#797e96
  • tab.unfocusedActiveForeground#797e96
  • tab.unfocusedInactiveForeground#797e96
  • terminal.ansiBlack#252a41
  • terminal.ansiBlue#627af4
  • terminal.ansiBrightBlack#5e6587
  • terminal.ansiBrightBlue#9094a7
  • terminal.ansiBrightCyan#a6aab9
  • terminal.ansiBrightGreen#5e6587
  • terminal.ansiBrightMagenta#516aec
  • terminal.ansiBrightRed#818b8d
  • terminal.ansiBrightWhite#e1e6ff
  • terminal.ansiBrightYellow#797e96
  • terminal.ansiCyan#67c9e4
  • terminal.ansiGreen#4961da
  • terminal.ansiMagenta#7289fd
  • terminal.ansiRed#4961da
  • terminal.ansiWhite#c3cdfe
  • terminal.ansiYellow#627af4
  • terminal.background#131520
  • terminal.foreground#a6aab9
  • terminalCursor.background#1b1f32
  • terminalCursor.foreground#516aec
  • textLink.activeForeground#67c9e4
  • textLink.foreground#67c9e4
  • titleBar.activeBackground#1b1f32
  • titleBar.activeForeground#c3cdfe
  • titleBar.inactiveBackground#131520
  • walkThrough.embeddedEditorBackground#131520
  • welcomePage.buttonBackground#131520
  • welcomePage.buttonHoverBackground#131520
  • widget.shadow#131520

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
#a6aab9italic
meta.embedded, source.groovy.embedded#a6aab9
comment, punctuation.definition.comment#444b6fitalic
variable, string constant.other.placeholder#4961da
constant.other.color#e1e6ff
invalid, invalid.illegal#e1e6ff
keyword, punctuation.accessor, storage.type#99e9ff
storage.modifier, constant.keyword.clojure#4db0cb
punctuation, punctuation.definition.tag, punctuation.separator.inheritance.php, punctuation.definition.tag.html, punctuation.definition.tag.begin.html, punctuation.definition.tag.end.html, punctuation.section.embedded, meta.function punctuation.separator.comma, punctuation.definition.string, punctuation.definition.parameters, punctuation.terminator.expression, punctuation.definition.arguments, punctuation.definition.array, punctuation.section.array, punctuation.definition.list.begin, punctuation.definition.list.end, punctuation.separator.arguments, punctuation.definition.list, meta.array, source.elixir punctuation.definition.string, string.quoted.double.json punctuation.definition.string.json#51587b
keyword.control, constant.other.color, keyword.other.template, keyword.other.substitution#75d5f0
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#4961da
meta.function-call, variable.function, support.function, keyword.other.debugger, keyword.other.special-method, entity.name.function.clojure#e1e6ff
meta.block variable.other#a6aab9
support.other.variable, string.other.link#99e9ff
constant.language, support.constant, constant.character, constant.escape, keyword.other.unit, keyword.other#86e0f9
constant.other.symbol, constant.other.key, entity.other.inherited-class, markup.heading, markup.inserted.git_gutter, meta.group.braces.curly constant.other.object.key.js string.unquoted.label.js#627af4normal
entity.name, support.type, support.class, support.orther.namespace.use.php, meta.use.php, support.other.namespace.php, markup.changed.git_gutter, support.type.sys-types#939c9f
support.type#67c9e4
source.css support.type.property-name, source.sass support.type.property-name, source.scss support.type.property-name, source.less support.type.property-name, source.stylus support.type.property-name, source.postcss support.type.property-name#8b9efd
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#4961da
variable.other.global.safer.php#8b9efd
variable.language#99e9ffitalic
entity.name.method.js#516aecitalic
meta.class-method.js entity.name.function.js, variable.function.constructor, keyword.control.conditional.js, keyword.control.conditional.ts, keyword.control.switch.js, keyword.control.switch.ts#5cbcd6
storage.type.function.arrow.js, storage.type.function.arrow.js.jsx, storage.type.function.arrow.ts, storage.type.function.arrow.tsx, storage.type.function.arrow.coffee, keyword.operator.assignment, keyword.operator.comparison#99e9ff
entity.name.function.go, source.go keyword.control.loop.go#e1e6ff
meta.class.ts entity.name.type.class, meta.class.tsx entity.name.type.class, meta.class meta.function-call variable.function.ts, meta.class meta.function-call variable.function.tsx, source.ts keyword.control.loop.ts, source.tsx keyword.control.loop.tsx, source.ts meta.interface.ts entity.name.type.interface.ts, source.tsx meta.interface.tsx entity.name.type.interface.tsx, source.ts meta.type.declaration.ts entity.name.type.ts, source.tsx meta.type.declaration.tsx entity.name.type.tsx#e1e6ff
meta.method.identifier.java entity.name.function.java, meta.method.identifier.java storage.type.generic.java, meta.class meta.function-call variable.function.java, source.java keyword.control.loop.java, storage.type.function.arrow.java, meta.class.identifier.java entity.name.type.class.java#e1e6ff
meta.method.identifier.cs entity.name.function.cs, meta.method.identifier.cs storage.type.generic.cs, meta.class meta.function-call variable.function.cs, source.cs keyword.control.loop.cs, storage.type.function.arrow.cs, meta.class.identifier.cs entity.name.type.class.cs, source.cs entity.name.function.cs, source.cs entity.name.type.class.cs#e1e6ff
source.elixir entity.name.function.elixir, entity.name.type.module.elixir#e1e6ff
keyword.control.flow.js, keyword.control.flow.js.jsx, keyword.control.trycatch.js, keyword.control.trycatch.js.jsx, source.js meta.group.braces.curly.js keyword.control.loop.js, source.js.jsx meta.group.braces.curly.js.jsx keyword.control.loop.js.jsx, source.js meta.export.default.js keyword.control.default.js, source.js.jsx meta.export.default.js.jsx keyword.control.default.js.jsx, keyword.control.switch.js, keyword.control.switch.js.jsx#99e9ff
keyword.control.flow.coffee, keyword.control.trycatch.coffee, source.coffee meta.group.braces.curly.coffee keyword.control.loop.coffee, source.coffee meta.export.default.coffee keyword.control.default.coffee, keyword.control.switch.coffee#99e9ff
keyword.control.flow.ts, keyword.control.flow.tsx, keyword.control.trycatch.ts, keyword.control.trycatch.tsx, source.ts meta.group.braces.curly.ts keyword.control.loop.ts, source.tsx meta.group.braces.curly.tsx keyword.control.loop.tsx, source.ts meta.export.default.ts keyword.control.default.ts, source.tsx meta.export.default.tsx keyword.control.default.tsx, keyword.control.switch.ts, keyword.control.switch.tsx#99e9ff
keyword.control.flow.php, keyword.control.trycatch.php, source.php meta.group.braces.curly.php keyword.control.loop.php, keyword.control.switch.php#99e9ff
source.shell meta.scope.while-loop.shell keyword.control.shell, source.shell meta.scope.for-in-loop.shell keyword.control.shell#99e9ffitalic
source.shell meta.scope.while-loop.shell meta.scope.if-block.shell keyword.control.shell, source.shell meta.scope.for-in-loop.shell meta.scope.if-block.shell keyword.control.shell#99e9ffitalic
keyword.control.flow.java, keyword.control.trycatch.java, source.java meta.group.braces.curly.java keyword.control.loop.java, keyword.control.switch.java#99e9ff
source.cs keyword.control.flow, keyword.control.trycatch.cs, source.cs meta.group.braces.curly.cs keyword.control.loop.cs, source.cs keyword.control.switch.cs#99e9ff
keyword.control.elixir#99e9ffitalic
keyword.control.java#99e9ffitalic
meta.tag.preprocessor.xml#99e9ff
meta.tag.preprocessor.xml entity.other.attribute-name#cbd4d7
keyword.operator.assignment#99e9ff
keyword.operator.logical.js, keyword.operator.logical.js.jsx#99e9ff
keyword.operator.logical.coffee#99e9ff
keyword.operator.logical.ts, keyword.operator.logical.tsx#99e9ff
source.go keyword.operator.assignment.go#99e9ffnormal
source.php keyword.operator, punctuation.separator.inheritance.php#99e9ff
source.shell meta.scope.logical-expression.shell#99e9ff
entity.other.attribute-name#7289fditalic
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name#a5b3fe
text.html.basic#c3cdfe
entity.other.attribute-name.class#e1e6ff
source.sass keyword.control#516aec
markup.inserted#71787a
markup.deleted#4961daitalic
markup.deleted.diff#4961da
markup.inserted.diff#71787aitalic
markup.changed#7289fditalic
string.regexp#67c9e4
constant.character.escape#67c9e4
*url*, *link*, *uri*underline
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js#4961daitalic
source.js constant.other.object.key.js string.unquoted.label.js#4961daitalic
support.type.property-name.json#516aec
support.constant.json#71787a
meta.structure.dictionary.value.json string.quoted.double#75d5f0
meta.structure.dictionary.json meta.structure.dictionary.value constant.language#99e9ff
source.json meta.structure.dictionary.json support.type.property-name.json#e1e6ff
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#a5b3fe
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#8b9efd
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#7289fd
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#627af4
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#516aec
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#4961da
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#4961da
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#4961da
text.html.markdown, punctuation.definition.list_item.markdown#e1e6ff
beginning.punctuation.definition.list.markdown#99e9ff
text.html.markdown markup.inline.raw.markdown#7289fd
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown#9094a7
text.html.markdown meta.dummy.line-break
markdown.heading, markup.heading | markup.heading entity.name, markup.heading.markdown punctuation.definition.heading.markdown, markup.heading1, markup.heading.markdown, entity.name, entity.name.section.markdown, heading.1.markdown#99e9ff
markup.heading.markdown punctuation.definition.heading.markdown#c3cdfe
markup.italic.markdownitalic
markup.bold, markup.bold string#818b8dbold
markup.bold markup.italic, markup.italic markup.bold, markup.quote markup.bold, markup.bold markup.italic string, markup.italic markup.bold string, markup.quote markup.bold string#818b8dbold
markup.underline#c3cdfeunderline
markup.strikestrike
markup.quote punctuation.definition.blockquote.markdown#1b1f32
markup.quote.markdown#c3cdfeitalic
beginning.punctuation.definition.quote.markdown#289dbd
meta.paragraph.markdown#c3cdfe
punctuation.definition.bold.markdown, punctuation.definition.italic.markdown#a5b3fe
markup.quoteitalic
string.other.link.title.markdown#99e9ff
markup.underline.link.markdown#a5b3fe
string.other.link.description.title.markdown#7289fd
constant.other.reference.link.markdown#939c9f
markup.raw.block#7289fd
markup.raw.block.fenced.markdown#1b1f3250
punctuation.definition.fenced.markdown#1b1f3250
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end#e1e6ff
variable.language.fenced.markdown#9094a7
meta.separator#9094a7bold
markup.table#e1e6ff
token.info-token#627af4
token.warn-token#818b8d
token.error-token#4961da
token.debug-token#7289fd
string, string.quoted#99e9ff
meta.attribute-selector.css entity.other.attribute-name.attribute, variable.other.readwrite.js#a5b3fe
support.constant.math#71787a
string.regexp#71787a
constant.numeric, constant.character.numeric#86e0f9
variable.language, variable.other#99e9ff
variable.language.this.js, variable.language.this.php#99e9ffitalic
keyword#71787a
storage, meta.var.expr, meta.class meta.method.declaration meta.var.expr storage.type.js, storage.type.property.js, storage.type.property.ts, storage.type.property.tsx#86e0f9italic
storage.type.class.js#99e9ff
entity.name.class, meta.class entity.name.type.class#c3cdfe
entity.name.type#a6aab9
entity.name.function#8b9efd
punctuation.definition.variable#a6aab9
punctuation.section.embedded.begin, punctuation.section.embedded.end#51587b
constant.language, punctuation.definition.constant, variable.other.constant, meta.preprocessor#e1e6ff
support.function.construct, keyword.other.new#33abcc
constant.character, constant.other#99e9ff
constant.character.escape#818b8d
string.regexp, string.regexp keyword.other#9094a7
entity.other.inherited-class#c3cdfe
entity.name.tag#e1e6ff
punctuation.definition.tag, meta.tag#797e96
entity.name.tag, meta.tag.other.html, meta.tag.other.js, meta.tag.other.tsx, entity.name.tag.tsx, entity.name.tag.js, entity.name.tag, meta.tag.js, meta.tag.tsx, meta.tag.html#e1e6ff
entity.other.attribute-name#e1e6ffitalic
entity.name.tag.custom#627af4
support.function#a5b3fe
punctuation.separator.continuation#4961da
invalid.broken#131520
invalid.unimplemented#e1e6ff
invalid.illegal#e1e6ff
support.type, support.class#67c9e4
support.variable.dom#99e9ff
support.type.exception#818b8d
support.other.variable
invalid#e1e6ff
invalid.deprecated#818b8d
keyword.operator#67c9e4normal
keyword.operator.relational#7289fditalic
keyword.operator.assignment#99e9ff
keyword.operator.arithmetic#8b9efd
keyword.operator.bitwise#7289fd
keyword.operator.increment#7289fd
keyword.operator.ternary#7289fd
comment.line.double-slash#5e6587
object#627af4
constant.language.null#e1e6ff
meta.brace#5e6587
meta.delimiter.period#c3cdfeitalic
constant.language.boolean#5cbcd6
object.comma#e1e6ff
variable.parameter.function#67c9e4
support.type.vendor.property-name, support.constant.vendor.property-value, support.type.property-name, meta.property-list entity.name.tag#939c9f
meta.property-list entity.name.tag.reference#627af4
constant.other.color.rgb-value punctuation.definition.constant#818b8d
meta.selector#7289fditalic
entity.other.attribute-name.id#75d5f0
meta.property-name#67c9e4
entity.name.tag.doctype, meta.tag.sgml.doctype#5e6587italic
keyword.control.operator#67c9e4
keyword.operator.logical#7289fd
variable.instance, variable.other.instance, variable.readwrite.instance, variable.other.readwrite.instance, variable.other.property#a5b3fe
variable.other.object.property#c3cdfeitalic
meta.function-call.js.jsx entity.name.function.js.jsx#7289fd
variable.other.object.js, variable.other.object.jsx, variable.object.property.js, variable.object.property.jsx#c3cdfe
keyword.operator.comparison, keyword.control.flow.js, keyword.control.flow.ts, keyword.control.flow.tsx, keyword.control.ruby, keyword.control.module.ruby, keyword.control.class.ruby, keyword.control.def.ruby, keyword.control.loop.js, keyword.control.loop.ts, keyword.control.import.js, keyword.control.import.ts, keyword.control.import.tsx, keyword.control.from.js, keyword.control.from.ts, keyword.control.from.tsx#99e9ffitalic
variable.interpolation#4961da
support.variable.property#67c9e4
string.template meta.template.expression#4961da
string.template punctuation.definition.string#c3cdfe
italic#7289fditalic
bold#71787abold
quote#5e6587italic
raw#a6aab9
variable.assignment.coffee#67c9e4
variable.parameter.function.coffee#c3cdfe
variable.assignment.coffee#71787a
variable.other.readwrite.cs#c3cdfe
entity.name.type.class.cs, storage.type.cs#516aec
entity.name.type.namespace.cs#a6aab9
entity.name.tag.css, entity.name.tag.less, entity.name.tag.custom.css, support.constant.property-value.css#e1e6ff
entity.name.tag.wildcard.css, entity.name.tag.wildcard.less, entity.name.tag.wildcard.scss, entity.name.tag.wildcard.sass#e1e6ff
keyword.other.unit.css, keyword.other.unit.px.css, keyword.other.unit.vw.css, keyword.other.unit.vh.css, keyword.other.unit.ch.css, keyword.other.unit.ex.css, keyword.other.unit.percentage.css, keyword.other.unit.rem.css, keyword.other.unit.em.css#4db0cb
keyword.control.at-rule.media.css#86e0f9
entity.other.attribute-name.id, punctuation.definition.entity.css#99e9ff
source.elixir support.type.elixir, source.elixir meta.module.elixir entity.name.class.elixir#516aec
source.elixir entity.name.function#71787a
source.elixir constant.other.symbol.elixir, source.elixir constant.other.keywords.elixir#627af4
source.elixir variable.other.readwrite.module.elixir, source.elixir variable.other.readwrite.module.elixir punctuation.definition.variable.elixir#71787a
source.elixir .punctuation.binary.elixir#7289fditalic
source.go meta.function-call.go#a6aab9
source.go keyword.package.go, source.go keyword.import.go, source.go keyword.function.go, source.go keyword.type.go, source.go keyword.struct.go, source.go keyword.interface.go, source.go keyword.const.go, source.go keyword.var.go, source.go keyword.map.go, source.go keyword.channel.go, source.go keyword.control.go#7289fditalic
source.go constant.language.go, source.go constant.other.placeholder.go#4961da
meta.class entity.name.type.class, entity.global.clojure#e1e6ff
meta.method.declaration storage.type.js, meta.symbol.clojure#a5b3fe
terminator.js#c3cdfe
meta.js punctuation.definition.js#c3cdfe
entity.name.type.instance.jsdoc, entity.name.type.instance.phpdoc#5e6587
variable.other.jsdoc, variable.other.phpdoc#67c9e4
variable.other.meta.import.js, meta.import.js variable.other, variable.other.meta.export.js, meta.export.js variable.other#c3cdfe
variable.parameter.function.js#516aec
variable.js, variable.other.js#c3cdfe
entity.name.type.js, entity.name.type.module.js#5cbcd6
support.class.js#c3cdfe
variable.other.ruby#c3cdfe
entity.name.type.class.ruby#8b9efd
constant.language.symbol.hashkey.ruby#516aec
meta.attribute-selector.less entity.other.attribute-name.attribute#627af4
variable.other.php, variable.other.property.php#c3cdfe
support.class.php#8b9efd
meta.function-call.php punctuation#c3cdfe
variable.other.global.php#7289fd
variable.other.global.php punctuation.definition.variable#7289fd
constant.language.python#7289fd
variable.parameter.function.python, meta.function-call.arguments.python#516aec
meta.function-call.python, meta.function-call.generic.python#c3cdfe
punctuation.python#c3cdfe
entity.name.function.decorator.python#4961da
source.python variable.language.special#516aec
variable.scss, variable.sass, variable.parameter.url.scss, variable.parameter.url.sass#a5b3fe
source.css.scss meta.at-rule variable, source.css.sass meta.at-rule variable#e1e6ff
meta.attribute-selector.scss entity.other.attribute-name.attribute, meta.attribute-selector.sass entity.other.attribute-name.attribute#516aec
entity.name.tag.scss, entity.name.tag.sass#e1e6ff
keyword.other.unit.scss, keyword.other.unit.sass#33abcc
variable.other.readwrite.alias.ts, variable.other.readwrite.alias.tsx, variable.other.readwrite.ts, variable.other.readwrite.tsx, variable.other.object.ts, variable.other.object.tsx, variable.object.property.ts, variable.object.property.tsx, variable.other.ts, variable.other.tsx, variable.tsx, variable.ts#c3cdfe
entity.name.type.ts, entity.name.type.tsx#516aec
support.class.node.ts, support.class.node.tsx#516aec
meta.type.parameters.ts entity.name.type, meta.type.parameters.tsx entity.name.type#5e6587
meta.import.ts punctuation.definition.block, meta.import.tsx punctuation.definition.block, meta.export.ts punctuation.definition.block, meta.export.tsx punctuation.definition.block#c3cdfe
meta.decorator punctuation.decorator.ts, meta.decorator punctuation.decorator.tsx#516aec
meta.tag.js meta.jsx.children.tsx#516aec
entity.name.tag.yaml#c3cdfe
variable.other.readwrite.js, variable.parameter#c3cdfe
support.class.component.js, support.class.component.tsx#e1e6ff
meta.jsx.children, meta.jsx.children.js, meta.jsx.children.tsx#c3cdfe
entity.name.type.tsx, entity.name.type.module.tsx#5cbcd6
meta.method.declaration storage.type.ts, meta.method.declaration storage.type.tsx#a5b3fe
meta.diff, meta.diff.header#c3cdfeitalic
markup.deleted#c3cdfe
markup.changed#c3cdfe
markup.inserted#c3cdfe
markup.quote#4961daitalic
markup.list#c3cdfe
markup.bold, markup.italic#c3cdfe
markup.inline.raw#99e9ff
markup.heading.setext#627af4

Shiki preview

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

Loading...