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#2c2839
  • activityBar.border#201d2a
  • activityBar.dropBackground#b5a0fe40
  • activityBar.foreground#afa9c1
  • activityBarBadge.background#7451e6
  • activityBarBadge.foreground#efebff
  • badge.background#7451e6
  • badge.foreground#efebff
  • breadcrumbPicker.background#15141a
  • button.background#7451e6
  • button.foreground#efebff
  • button.hoverBackground#8363ee
  • debugExceptionWidget.background#15141a
  • debugExceptionWidget.border#15141a
  • debugToolBar.background#15141a
  • debugToolBar.border#201d2a
  • descriptionForeground#dcd2fe
  • diffEditor.insertedTextBackground#7451e6
  • diffEditor.insertedTextBorder#7451e6
  • diffEditor.removedTextBackground#7451e6
  • diffEditor.removedTextBorder#7451e6
  • dropdown.background#2c2839
  • dropdown.border#201d2a
  • dropdown.foreground#efebff
  • editor.background#201d2a
  • editor.findMatchBackground#4b455f80
  • editor.findMatchHighlightBackground#625a7c80
  • editor.foreground#afa9c1
  • editor.hoverHighlightBackground#4b455f
  • editor.inactiveSelectionBackground#6e658b
  • editor.lineHighlightBackground#2c2839
  • editor.rangeHighlightBackground#2c2839
  • editor.selectionBackground#2c2839
  • editor.selectionHighlightBackground#2c2839
  • editor.wordHighlightBackground#2c2839
  • editor.wordHighlightStrongBackground#2c2839
  • editorBracketMatch.background#15141a
  • editorBracketMatch.border#6e658b
  • editorCodeLens.foreground#afa9c1
  • editorCursor.background#201d2a
  • editorCursor.foreground#a286fd
  • editorError.foreground#8363ee
  • editorGroup.background#6e658b
  • editorGroup.border#15141a
  • editorGroup.dropBackground#d294ff40
  • editorGroupHeader.noTabsBackground#2c2839
  • editorGroupHeader.tabsBackground#2c2839
  • editorGroupHeader.tabsBorder#15141a
  • editorGutter.addedBackground#2c2839
  • editorGutter.background#15141a64
  • editorGutter.deletedBackground#b042ff
  • editorGutter.modifiedBackground#9375f5
  • editorHoverWidget.background#15141a
  • editorHoverWidget.border#15141a
  • editorIndentGuide.activeBackground#4b455f
  • editorIndentGuide.background#2c2839
  • editorLineNumber.activeForeground#9992b0
  • editorLineNumber.foreground#4b455fE6
  • editorMarkerNavigation.background#2c2839
  • editorMarkerNavigationError.background#7451e6
  • editorMarkerNavigationWarning.background#9375f5
  • editorOverviewRuler.commonContentForeground#a286fd
  • editorOverviewRuler.currentContentForeground#a286fd
  • editorOverviewRuler.incomingContentForeground#a286fd
  • editorRuler.foreground#afa9c1
  • editorSuggestWidget.background#2c2839
  • editorSuggestWidget.border#15141a
  • editorSuggestWidget.foreground#d8cce0
  • editorSuggestWidget.highlightForeground#ecd1ff
  • editorSuggestWidget.selectedBackground#15141a
  • editorWarning.foreground#9375f5
  • editorWhitespace.foreground#6e658b
  • editorWidget.background#15141a
  • editorWidget.border#15141a
  • errorForeground#7451e6
  • extensionButton.prominentBackground#7451e6
  • extensionButton.prominentForeground#efebff
  • extensionButton.prominentHoverBackground#7451e6
  • focusBorder#4b455f80
  • foreground#afa9c1
  • gitDecoration.addedResourceForeground#c9b9fe
  • gitDecoration.conflictingResourceForeground#9375f5
  • gitDecoration.deletedResourceForeground#b042ff
  • gitDecoration.ignoredResourceForeground#4b455f
  • gitDecoration.modifiedResourceForeground#d294ff
  • gitDecoration.untrackedResourceForeground#faf8fc
  • input.background#2c2839
  • input.border#4b455f
  • input.foreground#dcd2fe
  • input.placeholderForeground#afa9c1
  • inputOption.activeBorder#d294ff
  • inputValidation.errorBackground#7451e6
  • inputValidation.errorBorder#7451e6
  • inputValidation.infoBackground#201d2a
  • inputValidation.infoBorder#8363ee
  • inputValidation.warningBackground#9375f5
  • inputValidation.warningBorder#9375f5
  • list.activeSelectionBackground#4b455fBF
  • list.activeSelectionForeground#dcd2fe
  • list.dropBackground#d294ff40
  • list.errorForeground#a286fd
  • list.focusBackground#2c2839
  • list.focusForeground#dba8ff
  • list.highlightForeground#dba8ff
  • list.hoverBackground#2c2839
  • list.hoverForeground#dba8ff
  • list.inactiveSelectionBackground#2c2839
  • list.inactiveSelectionForeground#827a9f
  • list.invalidItemForeground#a286fd
  • list.warningForeground#a286fd
  • merge.currentHeaderBackground#6e658b
  • merge.incomingHeaderBackground#8363ee
  • meta.objectliteral.js#8363ee
  • notificationLink.foreground#d294ff
  • notifications.background#15141a
  • notifications.foreground#dcd2fe
  • panel.background#15141a
  • panel.border#15141a
  • panel.dropBackground#b5a0fe40
  • panelTitle.activeBorder#625a7c
  • panelTitle.activeForeground#efebff
  • panelTitle.inactiveForeground#827a9f
  • peekView.border#2c2839
  • peekViewEditor.background#201d2a
  • peekViewEditor.matchHighlightBackground#7451e6
  • peekViewResult.background#201d2a
  • peekViewResult.fileForeground#9992b0
  • peekViewResult.lineForeground#625a7c
  • peekViewResult.matchHighlightBackground#7451e6
  • peekViewResult.selectionBackground#2c2839
  • peekViewResult.selectionForeground#afa9c1
  • peekViewTitle.background#15141a
  • peekViewTitleDescription.foreground#827a9f
  • peekViewTitleLabel.foreground#9992b0
  • pickerGroup.border#15141a
  • pickerGroup.foreground#dcd2fe
  • progress.background#6e658b
  • progressBar.background#9375f5
  • punctuation.definition.generic.begin.html#a286fd
  • scrollbar.shadow#15141a
  • scrollbarSlider.activeBackground#625a7c
  • scrollbarSlider.background#2c2839
  • scrollbarSlider.hoverBackground#4b455f
  • selection.background#9375f5
  • sideBar.background#15141a
  • sideBar.border#201d2a80
  • sideBar.dropBackground#b5a0fe40
  • sideBar.foreground#827a9f
  • sideBarSectionHeader.background#2c2839
  • sideBarSectionHeader.foreground#afa9c1
  • sideBarTitle.foreground#afa9c1
  • source.elm#6e658b
  • statusBar.background#201d2a
  • statusBar.border#2c2839
  • statusBar.debuggingBackground#201d2a
  • statusBar.debuggingBorder#201d2a
  • statusBar.foreground#6e658b
  • statusBar.noFolderBackground#201d2a
  • statusBar.noFolderBorder#2c2839
  • statusBarItem.activeBackground#6e658b
  • statusBarItem.hoverBackground#2c2839
  • statusBarItem.prominentBackground#2c2839
  • statusBarItem.prominentHoverBackground#2c2839
  • string.quoted.single.js#ecd1ff
  • tab.activeBackground#201d2a
  • tab.activeBorder#15141a
  • tab.activeForeground#efebff
  • tab.border#201d2a
  • tab.hoverBackground#201d2a
  • tab.inactiveBackground#2c2839
  • tab.inactiveForeground#827a9f
  • tab.unfocusedActiveBorder#827a9f
  • tab.unfocusedActiveForeground#827a9f
  • tab.unfocusedInactiveForeground#827a9f
  • terminal.ansiBlack#2c2839
  • terminal.ansiBlue#9375f5
  • terminal.ansiBrightBlack#6e658b
  • terminal.ansiBrightBlue#9992b0
  • terminal.ansiBrightCyan#afa9c1
  • terminal.ansiBrightGreen#6e658b
  • terminal.ansiBrightMagenta#8363ee
  • terminal.ansiBrightRed#8e8198
  • terminal.ansiBrightWhite#efebff
  • terminal.ansiBrightYellow#827a9f
  • terminal.ansiCyan#d294ff
  • terminal.ansiGreen#7451e6
  • terminal.ansiMagenta#a286fd
  • terminal.ansiRed#7451e6
  • terminal.ansiWhite#dcd2fe
  • terminal.ansiYellow#9375f5
  • terminal.background#15141a
  • terminal.foreground#afa9c1
  • terminalCursor.background#201d2a
  • terminalCursor.foreground#8363ee
  • textLink.activeForeground#d294ff
  • textLink.foreground#d294ff
  • titleBar.activeBackground#201d2a
  • titleBar.activeForeground#dcd2fe
  • titleBar.inactiveBackground#15141a
  • walkThrough.embeddedEditorBackground#15141a
  • welcomePage.buttonBackground#15141a
  • welcomePage.buttonHoverBackground#15141a
  • widget.shadow#15141a

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
#afa9c1italic
meta.embedded, source.groovy.embedded#afa9c1
comment, punctuation.definition.comment#4b455fitalic
variable, string constant.other.placeholder#7451e6
constant.other.color#efebff
invalid, invalid.illegal#efebff
keyword, punctuation.accessor, storage.type#ecd1ff
storage.modifier, constant.keyword.clojure#c16bff
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#625a7c
keyword.control, constant.other.color, keyword.other.template, keyword.other.substitution#dba8ff
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#7451e6
meta.function-call, variable.function, support.function, keyword.other.debugger, keyword.other.special-method, entity.name.function.clojure#efebff
meta.block variable.other#afa9c1
support.other.variable, string.other.link#ecd1ff
constant.language, support.constant, constant.character, constant.escape, keyword.other.unit, keyword.other#e3bdff
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#9375f5normal
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#a092aa
support.type#d294ff
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#b5a0fe
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#7451e6
variable.other.global.safer.php#b5a0fe
variable.language#ecd1ffitalic
entity.name.method.js#8363eeitalic
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#ca80ff
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#ecd1ff
entity.name.function.go, source.go keyword.control.loop.go#efebff
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#efebff
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#efebff
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#efebff
source.elixir entity.name.function.elixir, entity.name.type.module.elixir#efebff
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#ecd1ff
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#ecd1ff
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#ecd1ff
keyword.control.flow.php, keyword.control.trycatch.php, source.php meta.group.braces.curly.php keyword.control.loop.php, keyword.control.switch.php#ecd1ff
source.shell meta.scope.while-loop.shell keyword.control.shell, source.shell meta.scope.for-in-loop.shell keyword.control.shell#ecd1ffitalic
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#ecd1ffitalic
keyword.control.flow.java, keyword.control.trycatch.java, source.java meta.group.braces.curly.java keyword.control.loop.java, keyword.control.switch.java#ecd1ff
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#ecd1ff
keyword.control.elixir#ecd1ffitalic
keyword.control.java#ecd1ffitalic
meta.tag.preprocessor.xml#ecd1ff
meta.tag.preprocessor.xml entity.other.attribute-name#d8cce0
keyword.operator.assignment#ecd1ff
keyword.operator.logical.js, keyword.operator.logical.js.jsx#ecd1ff
keyword.operator.logical.coffee#ecd1ff
keyword.operator.logical.ts, keyword.operator.logical.tsx#ecd1ff
source.go keyword.operator.assignment.go#ecd1ffnormal
source.php keyword.operator, punctuation.separator.inheritance.php#ecd1ff
source.shell meta.scope.logical-expression.shell#ecd1ff
entity.other.attribute-name#a286fditalic
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name#c9b9fe
text.html.basic#dcd2fe
entity.other.attribute-name.class#efebff
source.sass keyword.control#8363ee
markup.inserted#7c6f85
markup.deleted#7451e6italic
markup.deleted.diff#7451e6
markup.inserted.diff#7c6f85italic
markup.changed#a286fditalic
string.regexp#d294ff
constant.character.escape#d294ff
*url*, *link*, *uri*underline
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js#7451e6italic
source.js constant.other.object.key.js string.unquoted.label.js#7451e6italic
support.type.property-name.json#8363ee
support.constant.json#7c6f85
meta.structure.dictionary.value.json string.quoted.double#dba8ff
meta.structure.dictionary.json meta.structure.dictionary.value constant.language#ecd1ff
source.json meta.structure.dictionary.json support.type.property-name.json#efebff
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#c9b9fe
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#b5a0fe
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#a286fd
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#9375f5
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#8363ee
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#7451e6
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#7451e6
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#7451e6
text.html.markdown, punctuation.definition.list_item.markdown#efebff
beginning.punctuation.definition.list.markdown#ecd1ff
text.html.markdown markup.inline.raw.markdown#a286fd
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown#9992b0
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#ecd1ff
markup.heading.markdown punctuation.definition.heading.markdown#dcd2fe
markup.italic.markdownitalic
markup.bold, markup.bold string#8e8198bold
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#8e8198bold
markup.underline#dcd2feunderline
markup.strikestrike
markup.quote punctuation.definition.blockquote.markdown#201d2a
markup.quote.markdown#dcd2feitalic
beginning.punctuation.definition.quote.markdown#b042ff
meta.paragraph.markdown#dcd2fe
punctuation.definition.bold.markdown, punctuation.definition.italic.markdown#c9b9fe
markup.quoteitalic
string.other.link.title.markdown#ecd1ff
markup.underline.link.markdown#c9b9fe
string.other.link.description.title.markdown#a286fd
constant.other.reference.link.markdown#a092aa
markup.raw.block#a286fd
markup.raw.block.fenced.markdown#201d2a50
punctuation.definition.fenced.markdown#201d2a50
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end#efebff
variable.language.fenced.markdown#9992b0
meta.separator#9992b0bold
markup.table#efebff
token.info-token#9375f5
token.warn-token#8e8198
token.error-token#7451e6
token.debug-token#a286fd
string, string.quoted#ecd1ff
meta.attribute-selector.css entity.other.attribute-name.attribute, variable.other.readwrite.js#c9b9fe
support.constant.math#7c6f85
string.regexp#7c6f85
constant.numeric, constant.character.numeric#e3bdff
variable.language, variable.other#ecd1ff
variable.language.this.js, variable.language.this.php#ecd1ffitalic
keyword#7c6f85
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#e3bdffitalic
storage.type.class.js#ecd1ff
entity.name.class, meta.class entity.name.type.class#dcd2fe
entity.name.type#afa9c1
entity.name.function#b5a0fe
punctuation.definition.variable#afa9c1
punctuation.section.embedded.begin, punctuation.section.embedded.end#625a7c
constant.language, punctuation.definition.constant, variable.other.constant, meta.preprocessor#efebff
support.function.construct, keyword.other.new#b957ff
constant.character, constant.other#ecd1ff
constant.character.escape#8e8198
string.regexp, string.regexp keyword.other#9992b0
entity.other.inherited-class#dcd2fe
entity.name.tag#efebff
punctuation.definition.tag, meta.tag#827a9f
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#efebff
entity.other.attribute-name#efebffitalic
entity.name.tag.custom#9375f5
support.function#c9b9fe
punctuation.separator.continuation#7451e6
invalid.broken#15141a
invalid.unimplemented#efebff
invalid.illegal#efebff
support.type, support.class#d294ff
support.variable.dom#ecd1ff
support.type.exception#8e8198
support.other.variable
invalid#efebff
invalid.deprecated#8e8198
keyword.operator#d294ffnormal
keyword.operator.relational#a286fditalic
keyword.operator.assignment#ecd1ff
keyword.operator.arithmetic#b5a0fe
keyword.operator.bitwise#a286fd
keyword.operator.increment#a286fd
keyword.operator.ternary#a286fd
comment.line.double-slash#6e658b
object#9375f5
constant.language.null#efebff
meta.brace#6e658b
meta.delimiter.period#dcd2feitalic
constant.language.boolean#ca80ff
object.comma#efebff
variable.parameter.function#d294ff
support.type.vendor.property-name, support.constant.vendor.property-value, support.type.property-name, meta.property-list entity.name.tag#a092aa
meta.property-list entity.name.tag.reference#9375f5
constant.other.color.rgb-value punctuation.definition.constant#8e8198
meta.selector#a286fditalic
entity.other.attribute-name.id#dba8ff
meta.property-name#d294ff
entity.name.tag.doctype, meta.tag.sgml.doctype#6e658bitalic
keyword.control.operator#d294ff
keyword.operator.logical#a286fd
variable.instance, variable.other.instance, variable.readwrite.instance, variable.other.readwrite.instance, variable.other.property#c9b9fe
variable.other.object.property#dcd2feitalic
meta.function-call.js.jsx entity.name.function.js.jsx#a286fd
variable.other.object.js, variable.other.object.jsx, variable.object.property.js, variable.object.property.jsx#dcd2fe
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#ecd1ffitalic
variable.interpolation#7451e6
support.variable.property#d294ff
string.template meta.template.expression#7451e6
string.template punctuation.definition.string#dcd2fe
italic#a286fditalic
bold#7c6f85bold
quote#6e658bitalic
raw#afa9c1
variable.assignment.coffee#d294ff
variable.parameter.function.coffee#dcd2fe
variable.assignment.coffee#7c6f85
variable.other.readwrite.cs#dcd2fe
entity.name.type.class.cs, storage.type.cs#8363ee
entity.name.type.namespace.cs#afa9c1
entity.name.tag.css, entity.name.tag.less, entity.name.tag.custom.css, support.constant.property-value.css#efebff
entity.name.tag.wildcard.css, entity.name.tag.wildcard.less, entity.name.tag.wildcard.scss, entity.name.tag.wildcard.sass#efebff
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#c16bff
keyword.control.at-rule.media.css#e3bdff
entity.other.attribute-name.id, punctuation.definition.entity.css#ecd1ff
source.elixir support.type.elixir, source.elixir meta.module.elixir entity.name.class.elixir#8363ee
source.elixir entity.name.function#7c6f85
source.elixir constant.other.symbol.elixir, source.elixir constant.other.keywords.elixir#9375f5
source.elixir variable.other.readwrite.module.elixir, source.elixir variable.other.readwrite.module.elixir punctuation.definition.variable.elixir#7c6f85
source.elixir .punctuation.binary.elixir#a286fditalic
source.go meta.function-call.go#afa9c1
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#a286fditalic
source.go constant.language.go, source.go constant.other.placeholder.go#7451e6
meta.class entity.name.type.class, entity.global.clojure#efebff
meta.method.declaration storage.type.js, meta.symbol.clojure#c9b9fe
terminator.js#dcd2fe
meta.js punctuation.definition.js#dcd2fe
entity.name.type.instance.jsdoc, entity.name.type.instance.phpdoc#6e658b
variable.other.jsdoc, variable.other.phpdoc#d294ff
variable.other.meta.import.js, meta.import.js variable.other, variable.other.meta.export.js, meta.export.js variable.other#dcd2fe
variable.parameter.function.js#8363ee
variable.js, variable.other.js#dcd2fe
entity.name.type.js, entity.name.type.module.js#ca80ff
support.class.js#dcd2fe
variable.other.ruby#dcd2fe
entity.name.type.class.ruby#b5a0fe
constant.language.symbol.hashkey.ruby#8363ee
meta.attribute-selector.less entity.other.attribute-name.attribute#9375f5
variable.other.php, variable.other.property.php#dcd2fe
support.class.php#b5a0fe
meta.function-call.php punctuation#dcd2fe
variable.other.global.php#a286fd
variable.other.global.php punctuation.definition.variable#a286fd
constant.language.python#a286fd
variable.parameter.function.python, meta.function-call.arguments.python#8363ee
meta.function-call.python, meta.function-call.generic.python#dcd2fe
punctuation.python#dcd2fe
entity.name.function.decorator.python#7451e6
source.python variable.language.special#8363ee
variable.scss, variable.sass, variable.parameter.url.scss, variable.parameter.url.sass#c9b9fe
source.css.scss meta.at-rule variable, source.css.sass meta.at-rule variable#efebff
meta.attribute-selector.scss entity.other.attribute-name.attribute, meta.attribute-selector.sass entity.other.attribute-name.attribute#8363ee
entity.name.tag.scss, entity.name.tag.sass#efebff
keyword.other.unit.scss, keyword.other.unit.sass#b957ff
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#dcd2fe
entity.name.type.ts, entity.name.type.tsx#8363ee
support.class.node.ts, support.class.node.tsx#8363ee
meta.type.parameters.ts entity.name.type, meta.type.parameters.tsx entity.name.type#6e658b
meta.import.ts punctuation.definition.block, meta.import.tsx punctuation.definition.block, meta.export.ts punctuation.definition.block, meta.export.tsx punctuation.definition.block#dcd2fe
meta.decorator punctuation.decorator.ts, meta.decorator punctuation.decorator.tsx#8363ee
meta.tag.js meta.jsx.children.tsx#8363ee
entity.name.tag.yaml#dcd2fe
variable.other.readwrite.js, variable.parameter#dcd2fe
support.class.component.js, support.class.component.tsx#efebff
meta.jsx.children, meta.jsx.children.js, meta.jsx.children.tsx#dcd2fe
entity.name.type.tsx, entity.name.type.module.tsx#ca80ff
meta.method.declaration storage.type.ts, meta.method.declaration storage.type.tsx#c9b9fe
meta.diff, meta.diff.header#dcd2feitalic
markup.deleted#dcd2fe
markup.changed#dcd2fe
markup.inserted#dcd2fe
markup.quote#7451e6italic
markup.list#dcd2fe
markup.bold, markup.italic#dcd2fe
markup.inline.raw#ecd1ff
markup.heading.setext#9375f5

Shiki preview

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

Loading...