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#171216
  • activityBar.border#0d070c
  • activityBar.dropBackground#403a40
  • activityBar.foreground#a99ea7
  • activityBarBadge.background#dd40cb
  • activityBarBadge.foreground#ffe6fc
  • badge.background#dd40cb
  • badge.foreground#e4dde3
  • breadcrumbPicker.background#0d070c
  • button.background#dd40cb
  • button.foreground#e4dde3
  • button.hoverBackground#dd40cb
  • debugExceptionWidget.background#0d070c
  • debugExceptionWidget.border#0d070c
  • debugToolBar.background#171216
  • descriptionForeground#e4dde3
  • diffEditor.insertedTextBackground#c27eed
  • diffEditor.insertedTextBorder#c27eed
  • diffEditor.removedTextBackground#c27eed
  • diffEditor.removedTextBorder#c27eed
  • dropdown.background#171216
  • dropdown.border#363035
  • dropdown.foreground#e4dde3
  • editor.background#201d20
  • editor.findMatchBackground#9e949d
  • editor.findMatchHighlightBackground#8b7e89
  • editor.foreground#ffe6fc
  • editor.hoverHighlightBackground#403a40
  • editor.inactiveSelectionBackground#766b75
  • editor.lineHighlightBackground#2b272a
  • editor.rangeHighlightBackground#403a40
  • editor.selectionBackground#403a40
  • editor.selectionHighlightBackground#403a40
  • editor.wordHighlightBackground#403a40
  • editor.wordHighlightStrongBackground#403a40
  • editorBracketMatch.background#0d070c
  • editorBracketMatch.border#2b272a
  • editorCodeLens.foreground#a99ea7
  • editorCursor.background#0d070c
  • editorCursor.foreground#67616b
  • editorError.foreground#e6854d
  • editorGroup.background#766b75
  • editorGroup.border#0d070c
  • editorGroup.dropBackground#b35ee8
  • editorGroupHeader.noTabsBackground#201d20
  • editorGroupHeader.tabsBackground#201d20
  • editorGroupHeader.tabsBorder#0d070c
  • editorGutter.addedBackground#c27eed
  • editorGutter.background#171216
  • editorGutter.deletedBackground#e78b55
  • editorGutter.modifiedBackground#eb7584
  • editorHoverWidget.background#0d070c
  • editorHoverWidget.border#0d070c
  • editorIndentGuide.activeBackground#363035
  • editorIndentGuide.background#2b272a
  • editorLineNumber.activeForeground#a99ea7
  • editorLineNumber.foreground#564e55
  • editorMarkerNavigation.background#2b272a
  • editorMarkerNavigationError.background#4c2610
  • editorMarkerNavigationWarning.background#54121b
  • editorOverviewRuler.commonContentForeground#eb7584
  • editorOverviewRuler.currentContentForeground#eb7584
  • editorOverviewRuler.incomingContentForeground#eb7584
  • editorRuler.foreground#a99ea7
  • editorSuggestWidget.background#171216
  • editorSuggestWidget.border#0d070c
  • editorSuggestWidget.foreground#a99ea7
  • editorSuggestWidget.highlightForeground#c27eed
  • editorSuggestWidget.selectedBackground#0d070c
  • editorWarning.foreground#eb7584
  • editorWhitespace.foreground#766b75
  • editorWidget.background#0d070c
  • editorWidget.border#0d070c
  • errorForeground#e47b3f
  • extensionButton.prominentBackground#c27eed
  • extensionButton.prominentForeground#f9f6f8
  • extensionButton.prominentHoverBackground#c27eed
  • focusBorder#b35ee8
  • foreground#ffe6fc
  • gitDecoration.addedResourceForeground#c27eed
  • gitDecoration.conflictingResourceForeground#eb7584
  • gitDecoration.deletedResourceForeground#e47b3f
  • gitDecoration.ignoredResourceForeground#403a40
  • gitDecoration.modifiedResourceForeground#b35ee8
  • gitDecoration.untrackedResourceForeground#e4dde3
  • input.background#403a40
  • input.border#8b7e89
  • input.foreground#e4dde3
  • input.placeholderForeground#a99ea7
  • inputOption.activeBorder#b35ee8
  • inputValidation.errorBackground#e47b3f
  • inputValidation.errorBorder#e47b3f
  • inputValidation.infoBackground#171216
  • inputValidation.infoBorder#eb7584
  • inputValidation.warningBackground#eb7584
  • inputValidation.warningBorder#eb7584
  • list.activeSelectionBackground#403a40
  • list.activeSelectionForeground#f9f6f8
  • list.dropBackground#403a40
  • list.errorForeground#e47b3f
  • list.focusBackground#403a40
  • list.focusForeground#e4dde3
  • list.highlightForeground#b35ee8
  • list.hoverBackground#403a40
  • list.hoverForeground#e4dde3
  • list.inactiveSelectionBackground#403a40
  • list.inactiveSelectionForeground#a99ea7
  • list.invalidItemForeground#eb7584
  • list.warningForeground#e47b3f
  • merge.currentHeaderBackground#766b75
  • merge.incomingHeaderBackground#eb7584
  • meta.objectliteral.js#eb7584
  • notificationLink.foreground#b35ee8
  • notifications.background#0d070c
  • notifications.foreground#e4dde3
  • panel.background#171216
  • panel.border#0d070c
  • panel.dropBackground#b35ee8
  • panelTitle.activeBorder#eb7584
  • panelTitle.activeForeground#f9f6f8
  • panelTitle.inactiveForeground#8b7e89
  • peekView.border#766b75
  • peekViewEditor.background#2b272a
  • peekViewEditor.matchHighlightBackground#eb7584
  • peekViewResult.background#171216
  • peekViewResult.fileForeground#403a40
  • peekViewResult.lineForeground#403a40
  • peekViewResult.matchHighlightBackground#f9f6f8
  • peekViewResult.selectionBackground#403a40
  • peekViewResult.selectionForeground#766b75
  • peekViewTitle.background#171216
  • peekViewTitleDescription.foreground#766b75
  • peekViewTitleLabel.foreground#766b75
  • pickerGroup.border#0d070c
  • pickerGroup.foreground#e4dde3
  • progress.background#766b75
  • progressBar.background#dd40cb
  • punctuation.definition.generic.begin.html#eb7584
  • scrollbar.shadow#0d070c
  • scrollbarSlider.activeBackground#4b444a
  • scrollbarSlider.background#2b272a
  • scrollbarSlider.hoverBackground#403a40
  • selection.background#dd40cb
  • sideBar.background#2b272a
  • sideBar.border#201d20
  • sideBar.foreground#766b75
  • sideBarSectionHeader.background#403a40
  • sideBarSectionHeader.foreground#a99ea7
  • sideBarTitle.foreground#a99ea7
  • source.elm#766b75
  • statusBar.background#171216
  • statusBar.border#201d20
  • statusBar.debuggingBackground#171216
  • statusBar.debuggingBorder#171216
  • statusBar.foreground#766b75
  • statusBar.noFolderBackground#171216
  • statusBar.noFolderBorder#403a40
  • statusBarItem.activeBackground#766b75
  • statusBarItem.hoverBackground#201d20
  • statusBarItem.prominentBackground#403a40
  • statusBarItem.prominentHoverBackground#403a40
  • string.quoted.single.js#f5a3eb
  • tab.activeBackground#201d20
  • tab.activeBorder#201d20
  • tab.activeForeground#e4dde3
  • tab.border#201d20
  • tab.hoverBackground#2b272a
  • tab.inactiveBackground#363035
  • tab.inactiveForeground#a99ea7
  • tab.unfocusedActiveBorder#8b7e89
  • tab.unfocusedActiveForeground#a99ea7
  • tab.unfocusedInactiveForeground#a99ea7
  • terminal.ansiBlack#403a40
  • terminal.ansiBlue#dd40cb
  • terminal.ansiBrightBlack#766b75
  • terminal.ansiBrightBlue#9e949d
  • terminal.ansiBrightCyan#a99ea7
  • terminal.ansiBrightGreen#766b75
  • terminal.ansiBrightMagenta#b2a9aa
  • terminal.ansiBrightRed#aba19b
  • terminal.ansiBrightWhite#f9f6f8
  • terminal.ansiBrightYellow#8b7e89
  • terminal.ansiCyan#b35ee8
  • terminal.ansiGreen#c27eed
  • terminal.ansiMagenta#eb7584
  • terminal.ansiRed#e47b3f
  • terminal.ansiWhite#e4dde3
  • terminal.ansiYellow#eb7584
  • terminal.background#0d070c
  • terminal.foreground#c7bcc6
  • textLink.activeForeground#b35ee8
  • textLink.foreground#b35ee8
  • titleBar.activeBackground#171216
  • titleBar.activeForeground#e4dde3
  • titleBar.inactiveBackground#0d070c
  • walkThrough.embeddedEditorBackground#0d070c
  • welcomePage.buttonBackground#0d070c
  • welcomePage.buttonHoverBackground#0d070c
  • widget.shadow#0d070c

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
#ffe6fc
meta.embedded, source.groovy.embedded#bdb2bc
comment, punctuation.definition.comment#81747fitalic
variable, string constant.other.placeholder#e47b3f
constant.other.color#ffe6fc
invalid, invalid.illegal#f9f6f8
keyword, punctuation.accessor, storage.type#eb7584
storage.modifier#eb7584
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#6b616a
keyword.control, constant.other.color, keyword.other.template, keyword.other.substitution#b35ee8
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#e47b3f
entity.name.function, meta.function-call, variable.function, support.function, keyword.other.debugger, keyword.other.special-method#eb7584
meta.block variable.other#bdb2bc
support.other.variable, string.other.link#e78b55
constant.language, support.constant, constant.character, constant.escape, keyword.other.unit, keyword.other#bdb2bc
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#dd40cbnormal
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#eb7584
support.type#b35ee8
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#f3919e
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#e47b3f
variable.language#e47b3fitalic
entity.name.method.js#eb7584italic
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#eb7584
entity.other.attribute-name#eb7584
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name#eb7584italic
entity.other.attribute-name.class#b9b2bd
source.sass keyword.control#eb7584
markup.inserted#c27eed
markup.deleted#e47b3f
markup.deleted.diff#e47b3f
markup.inserted.diff#c27eed
markup.changed#eb7584
string.regexp#b35ee8
constant.character.escape#b35ee8
*url*, *link*, *uri*underline
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js#e47b3fitalic
source.js constant.other.object.key.js string.unquoted.label.js#e47b3fitalic
support.type.property-name.json#eb7584
support.constant.json#c27eed
meta.structure.dictionary.value.json string.quoted.double#eb7584
meta.structure.dictionary.json meta.structure.dictionary.value constant.language#e47b3f
source.json meta.structure.dictionary.json support.type.property-name.json#eb7584
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#eb7584
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#c27eed
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#eb7584
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#eb7584
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#c27eed
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#c27eed
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#c27eed
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#c27eed
text.html.markdown, punctuation.definition.list_item.markdown#ffe6fc
text.html.markdown, beginning.punctuation.definition.list.markdown#bdb2bc
text.html.markdown markup.inline.raw.markdown#eb7584
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown#9e949d
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#e47b3f
markup.italic.markdown#e78b55italic
markup.bold, markup.bold string#e78b55bold
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#e78b55bold
markup.underline#eb7584underline
markup.strikestrike
markup.quote punctuation.definition.blockquote.markdown#171216
markup.quote.markdown#bdb2bc
markup.quoteitalic
string.other.link.title.markdown#eb7584
markup.underline.link.markdown#dd40cb
string.other.link.description.title.markdown#eb7584
constant.other.reference.link.markdown#eb7584
markup.raw.block#eb7584
markup.raw.block.fenced.markdown#171216
punctuation.definition.fenced.markdown#171216
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end#ffe6fc
variable.language.fenced.markdown#9e949d
meta.separator#9e949dbold
markup.table#ffe6fc
token.info-token#dd40cb
token.warn-token#e78b55
token.error-token#e47b3f
token.debug-token#eb7584
string#e4dde3
string.quoted, meta.attribute-selector.css entity.other.attribute-name.attribute, variable.other.readwrite.js#f5a3eb
support.constant.math#c27eed
string.regexp#c27eed
constant.numeric, constant.character.numeric#e4dde3
variable.language, variable.other#e47b3f
variable.language.this.js, variable.language.this.php#e47b3f
keyword#c27eed
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#bdb2bcitalic
entity.name.class, meta.class entity.name.type.class#e78b55
entity.name.type#bdb2bc
entity.name.function#bdb2bc
punctuation.definition.variable#bdb2bc
punctuation.section.embedded.begin, punctuation.section.embedded.end#eb75dd
constant.language, punctuation.definition.constant, variable.other.constant, meta.preprocessor#c27eed
support.function.construct, keyword.other.new#f17e8e
constant.character, constant.other#e78b55
constant.character.escape#e78b55
string.regexp, string.regexp keyword.other#9e949d
entity.other.inherited-class#eb7584
entity.name.tag#e47b3f
punctuation.definition.tag, meta.tag#bdb2bc
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#c27eed
entity.other.attribute-name#eb75dd
entity.name.tag.custom#dd40cb
support.function#bdb2bc
punctuation.separator.continuation#e47b3f
invalid.broken#0d070c
invalid.unimplemented#ffe6fc
invalid.illegal#ffe6fc
support.type, support.class#b35ee8
support.variable.dom#b35ee8
support.type.exception#e78b55
support.other.variable
invalid#ffe6fc
invalid.deprecated#e78b55
keyword.operator#b35ee8
keyword.operator.relational#eb7584italic
keyword.operator.assignment#eb7584
keyword.operator.arithmetic#eb7584
keyword.operator.bitwise#eb7584
keyword.operator.increment#eb7584
keyword.operator.ternary#eb7584
comment.line.double-slash#766b75
object#dd40cb
constant.language.null#e47b3f
meta.brace#766b75
meta.delimiter.period#e4dde3
constant.language.boolean#e47b3f
object.comma#f9f6f8
variable.parameter.function#b35ee8
support.type.vendor.property-name, support.constant.vendor.property-value, support.type.property-name, meta.property-list entity.name.tag#eb7584
meta.property-list entity.name.tag.reference#dd40cb
constant.other.color.rgb-value punctuation.definition.constant#e78b55
meta.selector#eb7584italic
entity.other.attribute-name.id#dad2d3
meta.property-name#b35ee8
entity.name.tag.doctype, meta.tag.sgml.doctype#766b75italic
keyword.control.operator#b35ee8
keyword.operator.logical#eb7584
variable.instance, variable.other.instance, variable.readwrite.instance, variable.other.readwrite.instance, variable.other.property#c27eed
variable.other.object.property#e4dde3italic
variable.other.object.js, variable.other.object.jsx, variable.object.property.js, variable.object.property.jsx#e4dde3
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#eb75dditalic
variable.interpolation#e47b3f
support.variable.property#b35ee8
string.template meta.template.expression#e47b3f
string.template punctuation.definition.string#e4dde3
italic#eb7584italic
bold#c27eedbold
quote#766b75italic
raw#bdb2bc
variable.assignment.coffee#b35ee8
variable.parameter.function.coffee#e4dde3
variable.assignment.coffee#c27eed
variable.other.readwrite.cs#e4dde3
entity.name.type.class.cs, storage.type.cs#eb7584
entity.name.type.namespace.cs#bdb2bc
entity.name.tag.css, entity.name.tag.less, entity.name.tag.custom.css#d7d2db
support.constant.property-value.css#c988f2
entity.name.tag.wildcard.css, entity.name.tag.wildcard.less, entity.name.tag.wildcard.scss, entity.name.tag.wildcard.sass#b35ee8
keyword.other.unit.css, keyword.control.at-rule.media.css#b35ee8
source.elixir support.type.elixir, source.elixir meta.module.elixir entity.name.class.elixir#eb7584
source.elixir entity.name.function#c27eed
source.elixir constant.other.symbol.elixir, source.elixir constant.other.keywords.elixir#dd40cb
source.elixir variable.other.readwrite.module.elixir, source.elixir variable.other.readwrite.module.elixir punctuation.definition.variable.elixir#c27eed
source.elixir .punctuation.binary.elixir#eb7584italic
source.go meta.function-call.go#bdb2bc
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#eb7584italic
source.go constant.language.go, source.go constant.other.placeholder.go#e47b3f
meta.class entity.name.type.class.js#e78b55
meta.method.declaration storage.type.js#b9b2bd
terminator.js#e4dde3
meta.js punctuation.definition.js#e4dde3
entity.name.type.instance.jsdoc, entity.name.type.instance.phpdoc#766b75
variable.other.jsdoc, variable.other.phpdoc#b35ee8
variable.other.meta.import.js, meta.import.js variable.other, variable.other.meta.export.js, meta.export.js variable.other#e4dde3
variable.parameter.function.js#eb7584
variable.js, variable.other.js#e4dde3
entity.name.type.js, entity.name.type.module.js#e78b55
support.class.js#e4dde3
variable.other.ruby#e4dde3
entity.name.type.class.ruby#e78b55
constant.language.symbol.hashkey.ruby#c27eed
meta.attribute-selector.less entity.other.attribute-name.attribute#e78b55
variable.other.php, variable.other.property.php#e4dde3
support.class.php#e78b55
meta.function-call.php punctuation#e4dde3
variable.other.global.php#c27eed
variable.other.global.php punctuation.definition.variable#c27eed
constant.language.python#e47b3f
variable.parameter.function.python, meta.function-call.arguments.python#eb7584
meta.function-call.python, meta.function-call.generic.python#e4dde3
punctuation.python#e4dde3
entity.name.function.decorator.python#c27eed
source.python variable.language.special#eb7584
variable.scss, variable.sass, variable.parameter.url.scss, variable.parameter.url.sass#b9b2bd
source.css.scss meta.at-rule variable, source.css.sass meta.at-rule variable#eb7584
meta.attribute-selector.scss entity.other.attribute-name.attribute, meta.attribute-selector.sass entity.other.attribute-name.attribute#e78b55
entity.name.tag.scss, entity.name.tag.sass#c27eed
keyword.other.unit.scss, keyword.other.unit.sass#eb7584
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#e4dde3
entity.name.type.ts, entity.name.type.tsx#e78b55
support.class.node.ts, support.class.node.tsx#eb7584
meta.type.parameters.ts entity.name.type, meta.type.parameters.tsx entity.name.type#766b75
meta.import.ts punctuation.definition.block, meta.import.tsx punctuation.definition.block, meta.export.ts punctuation.definition.block, meta.export.tsx punctuation.definition.block#e4dde3
meta.decorator punctuation.decorator.ts, meta.decorator punctuation.decorator.tsx#eb7584
meta.tag.js meta.jsx.children.tsx#eb7584
entity.name.tag.yaml#c27eed
variable.other.readwrite.js, variable.parameter#f17ee3
support.class.component.js, support.class.component.tsx#e78b55
meta.jsx.children, meta.jsx.children.js, meta.jsx.children.tsx#e4dde3
meta.class entity.name.type.class.tsx#e78b55
entity.name.type.tsx, entity.name.type.module.tsx#e78b55
meta.method.declaration storage.type.ts, meta.method.declaration storage.type.tsx#eb7584
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#e4dde3italic
markup.deleted#e4dde3
markup.changed#e4dde3
markup.inserted#e4dde3
markup.quote#c27eed
markup.list#c27eed
markup.bold, markup.italic#e78b55
markup.inline.raw#9e949d
markup.heading.setext#dd40cb

Shiki preview

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

Loading...