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#d1c7cb
  • activityBar.border#c7bdc1
  • activityBar.dropBackground#dad2d5
  • activityBar.foreground#363032
  • activityBarBadge.background#dd407c
  • activityBarBadge.foreground#ffe6ef
  • badge.background#dd407c
  • badge.foreground#ffe6ef
  • breadcrumbPicker.background#f9f6f7
  • button.background#dd407c
  • button.foreground#ffe6ef
  • button.hoverBackground#dd407c
  • debugExceptionWidget.background#f9f6f7
  • debugExceptionWidget.border#f9f6f7
  • debugToolBar.background#ede8ea
  • descriptionForeground#201d1e
  • diffEditor.insertedTextBackground#9a25ad
  • diffEditor.insertedTextBorder#9a25ad
  • diffEditor.removedTextBackground#9a25ad
  • diffEditor.removedTextBorder#9a25ad
  • dropdown.background#ede8ea
  • dropdown.border#d1c7cb
  • dropdown.foreground#201d1e
  • editor.background#ede8ea
  • editor.findMatchBackground#766b6f
  • editor.findMatchHighlightBackground#8b7e83
  • editor.foreground#15040b
  • editor.hoverHighlightBackground#d1c7cb
  • editor.inactiveSelectionBackground#9e9498
  • editor.lineHighlightBackground#e4dde0
  • editor.rangeHighlightBackground#dad2d5
  • editor.selectionBackground#dad2d5
  • editor.selectionHighlightBackground#dad2d5
  • editor.wordHighlightBackground#d1c7cb
  • editor.wordHighlightStrongBackground#d1c7cb
  • editorBracketMatch.background#f9f6f7
  • editorBracketMatch.border#dad2d5
  • editorCodeLens.foreground#6b6165
  • editorCursor.background#f9f6f7
  • editorCursor.foreground#b2a8b3
  • editorError.foreground#9f6404
  • editorGroup.background#9e9498
  • editorGroup.border#f9f6f7
  • editorGroup.dropBackground#be31d3
  • editorGroupHeader.noTabsBackground#e4dde0
  • editorGroupHeader.tabsBackground#e4dde0
  • editorGroupHeader.tabsBorder#f9f6f7
  • editorGutter.addedBackground#9a25ad
  • editorGutter.background#e4dde0
  • editorGutter.deletedBackground#955d04
  • editorGutter.modifiedBackground#a83324
  • editorHoverWidget.background#f9f6f7
  • editorHoverWidget.border#f9f6f7
  • editorIndentGuide.activeBackground#dad2d5
  • editorIndentGuide.background#d1c7cb
  • editorLineNumber.activeForeground#6b6165
  • editorLineNumber.foreground#bdb3b6
  • editorMarkerNavigation.background#d1c7cb
  • editorMarkerNavigationError.background#eeb863
  • editorMarkerNavigationWarning.background#f5ada3
  • editorOverviewRuler.commonContentForeground#a83324
  • editorOverviewRuler.currentContentForeground#a83324
  • editorOverviewRuler.incomingContentForeground#a83324
  • editorRuler.foreground#6b6165
  • editorSuggestWidget.background#e4dde0
  • editorSuggestWidget.border#f9f6f7
  • editorSuggestWidget.foreground#6b6165
  • editorSuggestWidget.highlightForeground#9a25ad
  • editorSuggestWidget.selectedBackground#f9f6f7
  • editorWarning.foreground#a83324
  • editorWhitespace.foreground#9e9498
  • editorWidget.background#f9f6f7
  • editorWidget.border#f9f6f7
  • errorForeground#ae6d04
  • extensionButton.prominentBackground#9a25ad
  • extensionButton.prominentForeground#f9f6f7
  • extensionButton.prominentHoverBackground#9a25ad
  • focusBorder#be31d3
  • foreground#15040b
  • gitDecoration.addedResourceForeground#9a25ad
  • gitDecoration.conflictingResourceForeground#a83324
  • gitDecoration.deletedResourceForeground#ae6d04
  • gitDecoration.ignoredResourceForeground#d1c7cb
  • gitDecoration.modifiedResourceForeground#be31d3
  • gitDecoration.untrackedResourceForeground#201d1e
  • input.background#d1c7cb
  • input.border#8b7e83
  • input.foreground#201d1e
  • input.placeholderForeground#6b6165
  • inputOption.activeBorder#be31d3
  • inputValidation.errorBackground#ae6d04
  • inputValidation.errorBorder#ae6d04
  • inputValidation.infoBackground#ede8ea
  • inputValidation.infoBorder#a83324
  • inputValidation.warningBackground#a83324
  • inputValidation.warningBorder#a83324
  • list.activeSelectionBackground#dad2d5
  • list.activeSelectionForeground#0d080a
  • list.dropBackground#e4dde0
  • list.errorForeground#ae6d04
  • list.focusBackground#dad2d5
  • list.focusForeground#201d1e
  • list.highlightForeground#be31d3
  • list.hoverBackground#dad2d5
  • list.hoverForeground#201d1e
  • list.inactiveSelectionBackground#d1c7cb
  • list.inactiveSelectionForeground#6b6165
  • list.invalidItemForeground#a83324
  • list.warningForeground#ae6d04
  • merge.currentHeaderBackground#9e9498
  • merge.incomingHeaderBackground#a83324
  • meta.objectliteral.js#a83324
  • notificationLink.foreground#be31d3
  • notifications.background#f9f6f7
  • notifications.foreground#201d1e
  • panel.background#ede8ea
  • panel.border#f9f6f7
  • panel.dropBackground#be31d3
  • panelTitle.activeBorder#a83324
  • panelTitle.activeForeground#0d080a
  • panelTitle.inactiveForeground#8b7e83
  • peekView.border#9e9498
  • peekViewEditor.background#d1c7cb
  • peekViewEditor.matchHighlightBackground#a83324
  • peekViewResult.background#d1c7cb
  • peekViewResult.fileForeground#d1c7cb
  • peekViewResult.lineForeground#d1c7cb
  • peekViewResult.matchHighlightBackground#0d080a
  • peekViewResult.selectionBackground#dad2d5
  • peekViewResult.selectionForeground#9e9498
  • peekViewTitle.background#e4dde0
  • peekViewTitleDescription.foreground#9e9498
  • peekViewTitleLabel.foreground#9e9498
  • pickerGroup.border#f9f6f7
  • pickerGroup.foreground#201d1e
  • progress.background#9e9498
  • progressBar.background#dd407c
  • punctuation.definition.generic.begin.html#a83324
  • scrollbar.shadow#766b6f
  • scrollbarSlider.activeBackground#bdb3b6
  • scrollbarSlider.background#d1c7cb
  • scrollbarSlider.hoverBackground#c7bdc1
  • selection.background#dd407c
  • sideBar.background#ede8ea
  • sideBar.border#e4dde0
  • sideBar.foreground#766b6f
  • sideBarSectionHeader.background#dad2d5
  • sideBarSectionHeader.foreground#6b6165
  • sideBarTitle.foreground#564e51
  • source.elm#9e9498
  • statusBar.background#b2a9ac
  • statusBar.border#bdb3b6
  • statusBar.debuggingBackground#a89fa2
  • statusBar.debuggingBorder#9e9498
  • statusBar.foreground#60575b
  • statusBar.noFolderBackground#ede8ea
  • statusBar.noFolderBorder#d1c7cb
  • statusBarItem.activeBackground#9e9498
  • statusBarItem.hoverBackground#9e9498
  • statusBarItem.prominentBackground#dad2d5
  • statusBarItem.prominentHoverBackground#d1c7cb
  • string.quoted.single.js#76193d
  • tab.activeBackground#ede8ea
  • tab.activeBorder#ede8ea
  • tab.activeForeground#201d1e
  • tab.border#ede8ea
  • tab.hoverBackground#dad2d5
  • tab.inactiveBackground#e4dde0
  • tab.inactiveForeground#6b6165
  • tab.unfocusedActiveBorder#8b7e83
  • tab.unfocusedActiveForeground#6b6165
  • tab.unfocusedInactiveForeground#6b6165
  • terminal.ansiBlack#d1c7cb
  • terminal.ansiBlue#dd407c
  • terminal.ansiBrightBlack#9e9498
  • terminal.ansiBrightBlue#766b6f
  • terminal.ansiBrightCyan#6b6165
  • terminal.ansiBrightGreen#9e9498
  • terminal.ansiBrightMagenta#635654
  • terminal.ansiBrightRed#70685c
  • terminal.ansiBrightWhite#0d080a
  • terminal.ansiBrightYellow#8b7e83
  • terminal.ansiCyan#be31d3
  • terminal.ansiGreen#9a25ad
  • terminal.ansiMagenta#a83324
  • terminal.ansiRed#ae6d04
  • terminal.ansiWhite#201d1e
  • terminal.ansiYellow#a83324
  • terminal.background#f9f6f7
  • terminal.foreground#4b4447
  • textLink.activeForeground#be31d3
  • textLink.foreground#be31d3
  • titleBar.activeBackground#ede8ea
  • titleBar.activeForeground#201d1e
  • titleBar.inactiveBackground#f9f6f7
  • walkThrough.embeddedEditorBackground#f9f6f7
  • welcomePage.buttonBackground#f9f6f7
  • welcomePage.buttonHoverBackground#f9f6f7
  • widget.shadow#a89fa2

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
#0d080a
meta.embedded, source.groovy.embedded#4b4447
comment, punctuation.definition.comment#94898ditalic
variable, string constant.other.placeholder#ae6d04
constant.other.color#15040b
invalid, invalid.illegal#0d080a
keyword, punctuation.accessor, storage.type#a83324
storage.modifier#a83324
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#a89fa2
keyword.control, constant.other.color, keyword.other.template, keyword.other.substitution#be31d3
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#ae6d04
entity.name.function, meta.function-call, variable.function, support.function, keyword.other.debugger, keyword.other.special-method#a83324
meta.block variable.other#4b4447
support.other.variable, string.other.link#955d04
constant.language, support.constant, constant.character, constant.escape, keyword.other.unit, keyword.other#564e51
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#dd407cnormal
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#a83324
support.type#be31d3
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#7a251a
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#ae6d04
variable.language#ae6d04italic
entity.name.method.js#a83324italic
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#a83324
entity.other.attribute-name#a83324
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name#a83324italic
entity.other.attribute-name.class#554e56
source.sass keyword.control#a83324
markup.inserted#9a25ad
markup.deleted#ae6d04
markup.deleted.diff#ae6d04
markup.inserted.diff#9a25ad
markup.changed#a83324
string.regexp#be31d3
constant.character.escape#be31d3
*url*, *link*, *uri*underline
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js#ae6d04italic
source.js constant.other.object.key.js string.unquoted.label.js#ae6d04italic
support.type.property-name.json#a83324
support.constant.json#9a25ad
meta.structure.dictionary.value.json string.quoted.double#a83324
meta.structure.dictionary.json meta.structure.dictionary.value constant.language#ae6d04
source.json meta.structure.dictionary.json support.type.property-name.json#a83324
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#a83324
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#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 support.type.property-name.json#a83324
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#a83324
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#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 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 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 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
text.html.markdown, punctuation.definition.list_item.markdown#15040b
text.html.markdown, beginning.punctuation.definition.list.markdown#564e51
text.html.markdown markup.inline.raw.markdown#a83324
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown#766b6f
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#ae6d04
markup.italic.markdown#955d04italic
markup.bold, markup.bold string#955d04bold
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#955d04bold
markup.underline#a83324underline
markup.strikestrike
markup.quote punctuation.definition.blockquote.markdown#ede8ea
markup.quote.markdown#564e51
markup.quoteitalic
string.other.link.title.markdown#a83324
markup.underline.link.markdown#dd407c
string.other.link.description.title.markdown#a83324
constant.other.reference.link.markdown#a83324
markup.raw.block#a83324
markup.raw.block.fenced.markdown#ede8ea
punctuation.definition.fenced.markdown#ede8ea
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end#15040b
variable.language.fenced.markdown#766b6f
meta.separator#766b6fbold
markup.table#15040b
token.info-token#dd407c
token.warn-token#955d04
token.error-token#ae6d04
token.debug-token#a83324
string#201d1e
string.quoted, meta.attribute-selector.css entity.other.attribute-name.attribute, variable.other.readwrite.js#611532
support.constant.math#9a25ad
string.regexp#9a25ad
constant.numeric, constant.character.numeric#201d1e
variable.language, variable.other#ae6d04
variable.language.this.js, variable.language.this.php#ae6d04
keyword#9a25ad
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#564e51italic
entity.name.class, meta.class entity.name.type.class#955d04
entity.name.type#564e51
entity.name.function#564e51
punctuation.definition.variable#564e51
punctuation.section.embedded.begin, punctuation.section.embedded.end#a82457
constant.language, punctuation.definition.constant, variable.other.constant, meta.preprocessor#9a25ad
support.function.construct, keyword.other.new#932d1f
constant.character, constant.other#955d04
constant.character.escape#955d04
string.regexp, string.regexp keyword.other#766b6f
entity.other.inherited-class#a83324
entity.name.tag#ae6d04
punctuation.definition.tag, meta.tag#564e51
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#9a25ad
entity.other.attribute-name#a82457
entity.name.tag.custom#dd407c
support.function#564e51
punctuation.separator.continuation#ae6d04
invalid.broken#f9f6f7
invalid.unimplemented#15040b
invalid.illegal#15040b
support.type, support.class#be31d3
support.variable.dom#be31d3
support.type.exception#955d04
support.other.variable
invalid#15040b
invalid.deprecated#955d04
keyword.operator#be31d3
keyword.operator.relational#a83324italic
keyword.operator.assignment#a83324
keyword.operator.arithmetic#a83324
keyword.operator.bitwise#a83324
keyword.operator.increment#a83324
keyword.operator.ternary#a83324
comment.line.double-slash#9e9498
object#dd407c
constant.language.null#ae6d04
meta.brace#9e9498
meta.delimiter.period#201d1e
constant.language.boolean#ae6d04
object.comma#0d080a
variable.parameter.function#be31d3
support.type.vendor.property-name, support.constant.vendor.property-value, support.type.property-name, meta.property-list entity.name.tag#a83324
meta.property-list entity.name.tag.reference#dd407c
constant.other.color.rgb-value punctuation.definition.constant#955d04
meta.selector#a83324italic
entity.other.attribute-name.id#37302f
meta.property-name#be31d3
entity.name.tag.doctype, meta.tag.sgml.doctype#9e9498italic
keyword.control.operator#be31d3
keyword.operator.logical#a83324
variable.instance, variable.other.instance, variable.readwrite.instance, variable.other.readwrite.instance, variable.other.property#9a25ad
variable.other.object.property#201d1eitalic
variable.other.object.js, variable.other.object.jsx, variable.object.property.js, variable.object.property.jsx#201d1e
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#a82457italic
variable.interpolation#ae6d04
support.variable.property#be31d3
string.template meta.template.expression#ae6d04
string.template punctuation.definition.string#201d1e
italic#a83324italic
bold#9a25adbold
quote#9e9498italic
raw#564e51
variable.assignment.coffee#be31d3
variable.parameter.function.coffee#201d1e
variable.assignment.coffee#9a25ad
variable.other.readwrite.cs#201d1e
entity.name.type.class.cs, storage.type.cs#a83324
entity.name.type.namespace.cs#564e51
entity.name.tag.css, entity.name.tag.less, entity.name.tag.custom.css#2a272b
support.constant.property-value.css#841f93
entity.name.tag.wildcard.css, entity.name.tag.wildcard.less, entity.name.tag.wildcard.scss, entity.name.tag.wildcard.sass#be31d3
keyword.other.unit.css, keyword.control.at-rule.media.css#be31d3
source.elixir support.type.elixir, source.elixir meta.module.elixir entity.name.class.elixir#a83324
source.elixir entity.name.function#9a25ad
source.elixir constant.other.symbol.elixir, source.elixir constant.other.keywords.elixir#dd407c
source.elixir variable.other.readwrite.module.elixir, source.elixir variable.other.readwrite.module.elixir punctuation.definition.variable.elixir#9a25ad
source.elixir .punctuation.binary.elixir#a83324italic
source.go meta.function-call.go#564e51
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#a83324italic
source.go constant.language.go, source.go constant.other.placeholder.go#ae6d04
meta.class entity.name.type.class.js#955d04
meta.method.declaration storage.type.js#554e56
terminator.js#201d1e
meta.js punctuation.definition.js#201d1e
entity.name.type.instance.jsdoc, entity.name.type.instance.phpdoc#9e9498
variable.other.jsdoc, variable.other.phpdoc#be31d3
variable.other.meta.import.js, meta.import.js variable.other, variable.other.meta.export.js, meta.export.js variable.other#201d1e
variable.parameter.function.js#a83324
variable.js, variable.other.js#201d1e
entity.name.type.js, entity.name.type.module.js#955d04
support.class.js#201d1e
variable.other.ruby#201d1e
entity.name.type.class.ruby#955d04
constant.language.symbol.hashkey.ruby#9a25ad
meta.attribute-selector.less entity.other.attribute-name.attribute#955d04
variable.other.php, variable.other.property.php#201d1e
support.class.php#955d04
meta.function-call.php punctuation#201d1e
variable.other.global.php#9a25ad
variable.other.global.php punctuation.definition.variable#9a25ad
constant.language.python#ae6d04
variable.parameter.function.python, meta.function-call.arguments.python#a83324
meta.function-call.python, meta.function-call.generic.python#201d1e
punctuation.python#201d1e
entity.name.function.decorator.python#9a25ad
source.python variable.language.special#a83324
variable.scss, variable.sass, variable.parameter.url.scss, variable.parameter.url.sass#554e56
source.css.scss meta.at-rule variable, source.css.sass meta.at-rule variable#a83324
meta.attribute-selector.scss entity.other.attribute-name.attribute, meta.attribute-selector.sass entity.other.attribute-name.attribute#955d04
entity.name.tag.scss, entity.name.tag.sass#9a25ad
keyword.other.unit.scss, keyword.other.unit.sass#a83324
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#201d1e
entity.name.type.ts, entity.name.type.tsx#955d04
support.class.node.ts, support.class.node.tsx#a83324
meta.type.parameters.ts entity.name.type, meta.type.parameters.tsx entity.name.type#9e9498
meta.import.ts punctuation.definition.block, meta.import.tsx punctuation.definition.block, meta.export.ts punctuation.definition.block, meta.export.tsx punctuation.definition.block#201d1e
meta.decorator punctuation.decorator.ts, meta.decorator punctuation.decorator.tsx#a83324
meta.tag.js meta.jsx.children.tsx#a83324
entity.name.tag.yaml#9a25ad
variable.other.readwrite.js, variable.parameter#931f4c
support.class.component.js, support.class.component.tsx#955d04
meta.jsx.children, meta.jsx.children.js, meta.jsx.children.tsx#201d1e
meta.class entity.name.type.class.tsx#955d04
entity.name.type.tsx, entity.name.type.module.tsx#955d04
meta.method.declaration storage.type.ts, meta.method.declaration storage.type.tsx#a83324
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#201d1eitalic
markup.deleted#201d1e
markup.changed#201d1e
markup.inserted#201d1e
markup.quote#9a25ad
markup.list#9a25ad
markup.bold, markup.italic#955d04
markup.inline.raw#766b6f
markup.heading.setext#dd407c

Shiki preview

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

Loading...