Skip to main content
CodingTheme

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#cbc7d1
  • activityBar.border#c0bcc7
  • activityBar.dropBackground#d5d2db
  • activityBar.foreground#323036
  • activityBarBadge.background#9263e3
  • activityBarBadge.foreground#f2ebff
  • badge.background#9263e3
  • badge.foreground#f2ebff
  • breadcrumbPicker.background#f7f6f9
  • button.background#9263e3
  • button.foreground#f2ebff
  • button.hoverBackground#9263e3
  • debugExceptionWidget.background#f7f6f9
  • debugExceptionWidget.border#f7f6f9
  • debugToolBar.background#eae8ed
  • descriptionForeground#1e1d20
  • diffEditor.insertedTextBackground#4358df
  • diffEditor.insertedTextBorder#4358df
  • diffEditor.removedTextBackground#4358df
  • diffEditor.removedTextBorder#4358df
  • dropdown.background#eae8ed
  • dropdown.border#cbc7d1
  • dropdown.foreground#1e1d20
  • editor.background#eae8ed
  • editor.findMatchBackground#6f6b76
  • editor.findMatchHighlightBackground#837e8b
  • editor.foreground#110623
  • editor.hoverHighlightBackground#cbc7d1
  • editor.inactiveSelectionBackground#98949e
  • editor.lineHighlightBackground#dfdde4
  • editor.rangeHighlightBackground#d5d2db
  • editor.selectionBackground#d5d2db
  • editor.selectionHighlightBackground#d5d2db
  • editor.wordHighlightBackground#cbc7d1
  • editor.wordHighlightStrongBackground#cbc7d1
  • editorBracketMatch.background#f7f6f9
  • editorBracketMatch.border#d5d2db
  • editorCodeLens.foreground#65616b
  • editorCursor.background#f7f6f9
  • editorCursor.foreground#a6a8b5
  • editorError.foreground#bd2861
  • editorGroup.background#98949e
  • editorGroup.border#f7f6f9
  • editorGroup.dropBackground#5468e8
  • editorGroupHeader.noTabsBackground#dfdde4
  • editorGroupHeader.tabsBackground#dfdde4
  • editorGroupHeader.tabsBorder#f7f6f9
  • editorGutter.addedBackground#4358df
  • editorGutter.background#dfdde4
  • editorGutter.deletedBackground#a82457
  • editorGutter.modifiedBackground#9a25ad
  • editorHoverWidget.background#f7f6f9
  • editorHoverWidget.border#f7f6f9
  • editorIndentGuide.activeBackground#d5d2db
  • editorIndentGuide.background#cbc7d1
  • editorLineNumber.activeForeground#65616b
  • editorLineNumber.foreground#b6b2bd
  • editorMarkerNavigation.background#cbc7d1
  • editorMarkerNavigationError.background#f5a3c2
  • editorMarkerNavigationWarning.background#eaa3f5
  • editorOverviewRuler.commonContentForeground#9a25ad
  • editorOverviewRuler.currentContentForeground#9a25ad
  • editorOverviewRuler.incomingContentForeground#9a25ad
  • editorRuler.foreground#65616b
  • editorSuggestWidget.background#dfdde4
  • editorSuggestWidget.border#f7f6f9
  • editorSuggestWidget.foreground#65616b
  • editorSuggestWidget.highlightForeground#4358df
  • editorSuggestWidget.selectedBackground#f7f6f9
  • editorWarning.foreground#9a25ad
  • editorWhitespace.foreground#98949e
  • editorWidget.background#f7f6f9
  • editorWidget.border#f7f6f9
  • errorForeground#d22d6c
  • extensionButton.prominentBackground#4358df
  • extensionButton.prominentForeground#f7f6f9
  • extensionButton.prominentHoverBackground#4358df
  • focusBorder#5468e8
  • foreground#110623
  • gitDecoration.addedResourceForeground#4358df
  • gitDecoration.conflictingResourceForeground#9a25ad
  • gitDecoration.deletedResourceForeground#d22d6c
  • gitDecoration.ignoredResourceForeground#cbc7d1
  • gitDecoration.modifiedResourceForeground#5468e8
  • gitDecoration.untrackedResourceForeground#1e1d20
  • input.background#cbc7d1
  • input.border#837e8b
  • input.foreground#1e1d20
  • input.placeholderForeground#65616b
  • inputOption.activeBorder#5468e8
  • inputValidation.errorBackground#d22d6c
  • inputValidation.errorBorder#d22d6c
  • inputValidation.infoBackground#eae8ed
  • inputValidation.infoBorder#9a25ad
  • inputValidation.warningBackground#9a25ad
  • inputValidation.warningBorder#9a25ad
  • list.activeSelectionBackground#d5d2db
  • list.activeSelectionForeground#09070d
  • list.dropBackground#dfdde4
  • list.errorForeground#d22d6c
  • list.focusBackground#d5d2db
  • list.focusForeground#1e1d20
  • list.highlightForeground#5468e8
  • list.hoverBackground#d5d2db
  • list.hoverForeground#1e1d20
  • list.inactiveSelectionBackground#cbc7d1
  • list.inactiveSelectionForeground#65616b
  • list.invalidItemForeground#9a25ad
  • list.warningForeground#d22d6c
  • merge.currentHeaderBackground#98949e
  • merge.incomingHeaderBackground#9a25ad
  • meta.objectliteral.js#9a25ad
  • notificationLink.foreground#5468e8
  • notifications.background#f7f6f9
  • notifications.foreground#1e1d20
  • panel.background#eae8ed
  • panel.border#f7f6f9
  • panel.dropBackground#5468e8
  • panelTitle.activeBorder#9a25ad
  • panelTitle.activeForeground#09070d
  • panelTitle.inactiveForeground#837e8b
  • peekView.border#98949e
  • peekViewEditor.background#cbc7d1
  • peekViewEditor.matchHighlightBackground#9a25ad
  • peekViewResult.background#cbc7d1
  • peekViewResult.fileForeground#cbc7d1
  • peekViewResult.lineForeground#cbc7d1
  • peekViewResult.matchHighlightBackground#09070d
  • peekViewResult.selectionBackground#d5d2db
  • peekViewResult.selectionForeground#98949e
  • peekViewTitle.background#dfdde4
  • peekViewTitleDescription.foreground#98949e
  • peekViewTitleLabel.foreground#98949e
  • pickerGroup.border#f7f6f9
  • pickerGroup.foreground#1e1d20
  • progress.background#98949e
  • progressBar.background#9263e3
  • punctuation.definition.generic.begin.html#9a25ad
  • scrollbar.shadow#6f6b76
  • scrollbarSlider.activeBackground#b6b2bd
  • scrollbarSlider.background#cbc7d1
  • scrollbarSlider.hoverBackground#c0bcc7
  • selection.background#9263e3
  • sideBar.background#eae8ed
  • sideBar.border#dfdde4
  • sideBar.foreground#6f6b76
  • sideBarSectionHeader.background#d5d2db
  • sideBarSectionHeader.foreground#65616b
  • sideBarTitle.foreground#514e56
  • source.elm#98949e
  • statusBar.background#aca8b3
  • statusBar.border#b6b2bd
  • statusBar.debuggingBackground#a29ea9
  • statusBar.debuggingBorder#98949e
  • statusBar.foreground#5b5760
  • statusBar.noFolderBackground#eae8ed
  • statusBar.noFolderBorder#cbc7d1
  • statusBarItem.activeBackground#98949e
  • statusBarItem.hoverBackground#98949e
  • statusBarItem.prominentBackground#d5d2db
  • statusBarItem.prominentHoverBackground#cbc7d1
  • string.quoted.single.js#531fad
  • tab.activeBackground#eae8ed
  • tab.activeBorder#eae8ed
  • tab.activeForeground#1e1d20
  • tab.border#eae8ed
  • tab.hoverBackground#d5d2db
  • tab.inactiveBackground#dfdde4
  • tab.inactiveForeground#65616b
  • tab.unfocusedActiveBorder#837e8b
  • tab.unfocusedActiveForeground#65616b
  • tab.unfocusedInactiveForeground#65616b
  • terminal.ansiBlack#cbc7d1
  • terminal.ansiBlue#9263e3
  • terminal.ansiBrightBlack#98949e
  • terminal.ansiBrightBlue#6f6b76
  • terminal.ansiBrightCyan#65616b
  • terminal.ansiBrightGreen#98949e
  • terminal.ansiBrightMagenta#5f5760
  • terminal.ansiBrightRed#6b6165
  • terminal.ansiBrightWhite#09070d
  • terminal.ansiBrightYellow#837e8b
  • terminal.ansiCyan#5468e8
  • terminal.ansiGreen#4358df
  • terminal.ansiMagenta#9a25ad
  • terminal.ansiRed#d22d6c
  • terminal.ansiWhite#1e1d20
  • terminal.ansiYellow#9a25ad
  • terminal.background#f7f6f9
  • terminal.foreground#46444b
  • textLink.activeForeground#5468e8
  • textLink.foreground#5468e8
  • titleBar.activeBackground#eae8ed
  • titleBar.activeForeground#1e1d20
  • titleBar.inactiveBackground#f7f6f9
  • walkThrough.embeddedEditorBackground#f7f6f9
  • welcomePage.buttonBackground#f7f6f9
  • welcomePage.buttonHoverBackground#f7f6f9
  • widget.shadow#a29ea9

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
#09070d
meta.embedded, source.groovy.embedded#46444b
comment, punctuation.definition.comment#8d8994italic
variable, string constant.other.placeholder#d22d6c
constant.other.color#110623
invalid, invalid.illegal#09070d
keyword, punctuation.accessor, storage.type#9a25ad
storage.modifier#9a25ad
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#a29ea9
keyword.control, constant.other.color, keyword.other.template, keyword.other.substitution#5468e8
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#d22d6c
entity.name.function, meta.function-call, variable.function, support.function, keyword.other.debugger, keyword.other.special-method#9a25ad
meta.block variable.other#46444b
support.other.variable, string.other.link#a82457
constant.language, support.constant, constant.character, constant.escape, keyword.other.unit, keyword.other#514e56
string, 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#9263e3normal
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#9a25ad
support.type#5468e8
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#661872
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#d22d6c
variable.language#d22d6citalic
entity.name.method.js#9a25aditalic
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#9a25ad
entity.other.attribute-name#9a25ad
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name#9a25aditalic
entity.other.attribute-name.class#4a4c59
source.sass keyword.control#9a25ad
markup.inserted#4358df
markup.deleted#d22d6c
markup.deleted.diff#d22d6c
markup.inserted.diff#4358df
markup.changed#9a25ad
string.regexp#5468e8
constant.character.escape#5468e8
*url*, *link*, *uri*underline
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js#d22d6citalic
source.js constant.other.object.key.js string.unquoted.label.js#d22d6citalic
support.type.property-name.json#9a25ad
support.constant.json#4358df
meta.structure.dictionary.value.json string.quoted.double#9a25ad
meta.structure.dictionary.json meta.structure.dictionary.value constant.language#d22d6c
source.json meta.structure.dictionary.json support.type.property-name.json#9a25ad
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#9a25ad
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#4358df
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#9a25ad
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#9a25ad
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#4358df
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#4358df
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#4358df
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#4358df
text.html.markdown, punctuation.definition.list_item.markdown#110623
text.html.markdown, beginning.punctuation.definition.list.markdown#514e56
text.html.markdown markup.inline.raw.markdown#9a25ad
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown#6f6b76
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#d22d6c
markup.italic.markdown#a82457italic
markup.bold, markup.bold string#a82457bold
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#a82457bold
markup.underline#9a25adunderline
markup.strikestrike
markup.quote punctuation.definition.blockquote.markdown#eae8ed
markup.quote.markdown#514e56
markup.quoteitalic
string.other.link.title.markdown#9a25ad
markup.underline.link.markdown#9263e3
string.other.link.description.title.markdown#9a25ad
constant.other.reference.link.markdown#9a25ad
markup.raw.block#9a25ad
markup.raw.block.fenced.markdown#eae8ed
punctuation.definition.fenced.markdown#eae8ed
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end#110623
variable.language.fenced.markdown#6f6b76
meta.separator#6f6b76bold
markup.table#110623
token.info-token#9263e3
token.warn-token#a82457
token.error-token#d22d6c
token.debug-token#9a25ad
string#1e1d20
string.quoted, meta.attribute-selector.css entity.other.attribute-name.attribute, variable.other.readwrite.js#491b98
support.constant.math#4358df
string.regexp#4358df
constant.numeric, constant.character.numeric#1e1d20
variable.language, variable.other#d22d6c
variable.language.this.js, variable.language.this.php#d22d6c
keyword#4358df
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#514e56italic
entity.name.class, meta.class entity.name.type.class#a82457
entity.name.type#514e56
entity.name.function#514e56
punctuation.definition.variable#514e56
punctuation.section.embedded.begin, punctuation.section.embedded.end#773cdd
constant.language, punctuation.definition.constant, variable.other.constant, meta.preprocessor#4358df
support.function.construct, keyword.other.new#841f93
constant.character, constant.other#a82457
constant.character.escape#a82457
string.regexp, string.regexp keyword.other#6f6b76
entity.other.inherited-class#9a25ad
entity.name.tag#d22d6c
punctuation.definition.tag, meta.tag#514e56
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#4358df
entity.other.attribute-name#773cdd
entity.name.tag.custom#9263e3
support.function#514e56
punctuation.separator.continuation#d22d6c
invalid.broken#f7f6f9
invalid.unimplemented#110623
invalid.illegal#110623
support.type, support.class#5468e8
support.variable.dom#5468e8
support.type.exception#a82457
support.other.variable
invalid#110623
invalid.deprecated#a82457
keyword.operator#5468e8
keyword.operator.relational#9a25aditalic
keyword.operator.assignment#9a25ad
keyword.operator.arithmetic#9a25ad
keyword.operator.bitwise#9a25ad
keyword.operator.increment#9a25ad
keyword.operator.ternary#9a25ad
comment.line.double-slash#98949e
object#9263e3
constant.language.null#d22d6c
meta.brace#98949e
meta.delimiter.period#1e1d20
constant.language.boolean#d22d6c
object.comma#09070d
variable.parameter.function#5468e8
support.type.vendor.property-name, support.constant.vendor.property-value, support.type.property-name, meta.property-list entity.name.tag#9a25ad
meta.property-list entity.name.tag.reference#9263e3
constant.other.color.rgb-value punctuation.definition.constant#a82457
meta.selector#9a25aditalic
entity.other.attribute-name.id#353036
meta.property-name#5468e8
entity.name.tag.doctype, meta.tag.sgml.doctype#98949eitalic
keyword.control.operator#5468e8
keyword.operator.logical#9a25ad
variable.instance, variable.other.instance, variable.readwrite.instance, variable.other.readwrite.instance, variable.other.property#4358df
variable.other.object.property#1e1d20italic
variable.other.object.js, variable.other.object.jsx, variable.object.property.js, variable.object.property.jsx#1e1d20
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#773cdditalic
variable.interpolation#d22d6c
support.variable.property#5468e8
string.template meta.template.expression#d22d6c
string.template punctuation.definition.string#1e1d20
italic#9a25aditalic
bold#4358dfbold
quote#98949eitalic
raw#514e56
variable.assignment.coffee#5468e8
variable.parameter.function.coffee#1e1d20
variable.assignment.coffee#4358df
variable.other.readwrite.cs#1e1d20
entity.name.type.class.cs, storage.type.cs#9a25ad
entity.name.type.namespace.cs#514e56
entity.name.tag.css, entity.name.tag.less, entity.name.tag.custom.css#25262c
support.constant.property-value.css#364ddd
entity.name.tag.wildcard.css, entity.name.tag.wildcard.less, entity.name.tag.wildcard.scss, entity.name.tag.wildcard.sass#5468e8
keyword.other.unit.css, keyword.control.at-rule.media.css#5468e8
source.elixir support.type.elixir, source.elixir meta.module.elixir entity.name.class.elixir#9a25ad
source.elixir entity.name.function#4358df
source.elixir constant.other.symbol.elixir, source.elixir constant.other.keywords.elixir#9263e3
source.elixir variable.other.readwrite.module.elixir, source.elixir variable.other.readwrite.module.elixir punctuation.definition.variable.elixir#4358df
source.elixir .punctuation.binary.elixir#9a25aditalic
source.go meta.function-call.go#514e56
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#9a25aditalic
source.go constant.language.go, source.go constant.other.placeholder.go#d22d6c
meta.class entity.name.type.class.js#a82457
meta.method.declaration storage.type.js#4a4c59
terminator.js#1e1d20
meta.js punctuation.definition.js#1e1d20
entity.name.type.instance.jsdoc, entity.name.type.instance.phpdoc#98949e
variable.other.jsdoc, variable.other.phpdoc#5468e8
variable.other.meta.import.js, meta.import.js variable.other, variable.other.meta.export.js, meta.export.js variable.other#1e1d20
variable.parameter.function.js#9a25ad
variable.js, variable.other.js#1e1d20
entity.name.type.js, entity.name.type.module.js#a82457
support.class.js#1e1d20
variable.other.ruby#1e1d20
entity.name.type.class.ruby#a82457
constant.language.symbol.hashkey.ruby#4358df
meta.attribute-selector.less entity.other.attribute-name.attribute#a82457
variable.other.php, variable.other.property.php#1e1d20
support.class.php#a82457
meta.function-call.php punctuation#1e1d20
variable.other.global.php#4358df
variable.other.global.php punctuation.definition.variable#4358df
constant.language.python#d22d6c
variable.parameter.function.python, meta.function-call.arguments.python#9a25ad
meta.function-call.python, meta.function-call.generic.python#1e1d20
punctuation.python#1e1d20
entity.name.function.decorator.python#4358df
source.python variable.language.special#9a25ad
variable.scss, variable.sass, variable.parameter.url.scss, variable.parameter.url.sass#4a4c59
source.css.scss meta.at-rule variable, source.css.sass meta.at-rule variable#9a25ad
meta.attribute-selector.scss entity.other.attribute-name.attribute, meta.attribute-selector.sass entity.other.attribute-name.attribute#a82457
entity.name.tag.scss, entity.name.tag.sass#4358df
keyword.other.unit.scss, keyword.other.unit.sass#9a25ad
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#1e1d20
entity.name.type.ts, entity.name.type.tsx#a82457
support.class.node.ts, support.class.node.tsx#9a25ad
meta.type.parameters.ts entity.name.type, meta.type.parameters.tsx entity.name.type#98949e
meta.import.ts punctuation.definition.block, meta.import.tsx punctuation.definition.block, meta.export.ts punctuation.definition.block, meta.export.tsx punctuation.definition.block#1e1d20
meta.decorator punctuation.decorator.ts, meta.decorator punctuation.decorator.tsx#9a25ad
meta.tag.js meta.jsx.children.tsx#9a25ad
entity.name.tag.yaml#4358df
variable.other.readwrite.js, variable.parameter#6b2bda
support.class.component.js, support.class.component.tsx#a82457
meta.jsx.children, meta.jsx.children.js, meta.jsx.children.tsx#1e1d20
meta.class entity.name.type.class.tsx#a82457
entity.name.type.tsx, entity.name.type.module.tsx#a82457
meta.method.declaration storage.type.ts, meta.method.declaration storage.type.tsx#9a25ad
meta.property-list.css meta.property-value.css variable.other.less, meta.property-list.scss variable.scss, meta.property-list.sass variable.sass, meta.brace, keyword.operator.operator, keyword.operator.or.regexp, keyword.operator.expression.in, keyword.operator.relational, keyword.operator.assignment, keyword.operator.comparison, keyword.operator.type, keyword.operator, keyword, punctuation.definintion.string, punctuation, variable.other.readwrite.js, storage.type, source.css, entity.other.attribute-name.class, entity.other.attribute-name.id, string.quoted
meta.diff, meta.diff.header#1e1d20italic
markup.deleted#1e1d20
markup.changed#1e1d20
markup.inserted#1e1d20
markup.quote#4358df
markup.list#4358df
markup.bold, markup.italic#a82457
markup.inline.raw#6f6b76
markup.heading.setext#9263e3

Shiki preview

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

Loading...