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#8a858580
  • activityBar.border#8a858540
  • activityBar.dropBackground#e7dfdfE6
  • activityBar.foreground#585050
  • activityBarBadge.background#7272ca
  • activityBarBadge.foreground#f4ecec
  • badge.background#7272ca
  • badge.foreground#f4ecec
  • breadcrumbPicker.background#e7dfdfF2
  • button.background#7272ca
  • button.foreground#f4ecec
  • button.hoverBackground#7272ca80
  • debugExceptionWidget.background#e7dfdf
  • debugExceptionWidget.border#e7dfdf80
  • debugToolBar.background#f4ecec
  • descriptionForeground#292424
  • diffEditor.insertedTextBackground#4b8b8b23
  • diffEditor.insertedTextBorder#4b8b8b33
  • diffEditor.removedTextBackground#4b8b8b33
  • diffEditor.removedTextBorder#4b8b8b4D
  • dropdown.background#f4ecec
  • dropdown.border#5485b699
  • dropdown.foreground#292424
  • editor.background#f4ecec
  • editor.findMatchBackground#8a858540
  • editor.findMatchHighlightBackground#7e777740
  • editor.foreground#585050
  • editor.hoverHighlightBackground#8a858564
  • editor.inactiveSelectionBackground#5850508C
  • editor.lineHighlightBackground#e7dfdf
  • editor.rangeHighlightBackground#e7dfdf
  • editor.selectionBackground#e7dfdfE6
  • editor.selectionHighlightBackground#e7dfdf8C
  • editor.wordHighlightBackground#e7dfdfA6
  • editor.wordHighlightStrongBackground#e7dfdf8C
  • editorBracketMatch.background#e7dfdf
  • editorBracketMatch.border#58505080
  • editorCodeLens.foreground#585050BF
  • editorCursor.background#f4ecec
  • editorCursor.foreground#585050
  • editorError.foreground#b45a3c
  • editorGroup.background#585050
  • editorGroup.border#e7dfdf
  • editorGroup.dropBackground#5485b644
  • editorGroupHeader.noTabsBackground#e7dfdfF2
  • editorGroupHeader.tabsBackground#e7dfdfF2
  • editorGroupHeader.tabsBorder#e7dfdfF2
  • editorGutter.addedBackground#4b8b8b80
  • editorGutter.background#e7dfdf4D
  • editorGutter.deletedBackground#b45a3c
  • editorGutter.modifiedBackground#a06e3b
  • editorHoverWidget.background#e7dfdf
  • editorHoverWidget.border#e7dfdf80
  • editorIndentGuide.activeBackground#58505080
  • editorIndentGuide.background#58505026
  • editorLineNumber.activeForeground#7e7777
  • editorLineNumber.foreground#58505059
  • editorMarkerNavigation.background#f4ecec
  • editorMarkerNavigationError.background#b45a3c
  • editorMarkerNavigationWarning.background#ca4949
  • editorOverviewRuler.commonContentForeground#bd5187
  • editorOverviewRuler.currentContentForeground#bd5187
  • editorOverviewRuler.incomingContentForeground#bd5187
  • editorRuler.foreground#58505080
  • editorSuggestWidget.background#e7dfdf
  • editorSuggestWidget.border#e7dfdf80
  • editorSuggestWidget.foreground#585050
  • editorSuggestWidget.highlightForeground#b45a3c
  • editorSuggestWidget.selectedBackground#8a858540
  • editorWarning.foreground#a06e3b
  • editorWhitespace.foreground#58505064
  • editorWidget.background#e7dfdf
  • editorWidget.border#e7dfdf80
  • errorForeground#ca494922
  • extensionButton.prominentBackground#4b8b8bCC
  • extensionButton.prominentForeground#1b1818
  • extensionButton.prominentHoverBackground#4b8b8b
  • focusBorder#5485b666
  • foreground#585050
  • gitDecoration.addedResourceForeground#4b8b8b
  • gitDecoration.conflictingResourceForeground#a06e3b
  • gitDecoration.deletedResourceForeground#ca494990
  • gitDecoration.ignoredResourceForeground#8a858580
  • gitDecoration.modifiedResourceForeground#5485b6
  • gitDecoration.untrackedResourceForeground#292424
  • input.background#e7dfdf
  • input.border#8a858580
  • input.foreground#292424
  • input.placeholderForeground#585050AA
  • inputOption.activeBorder#5485b699
  • inputValidation.errorBackground#ca4949
  • inputValidation.errorBorder#ca494988
  • inputValidation.infoBackground#f4ecec
  • inputValidation.infoBorder#8464c4
  • inputValidation.warningBackground#a06e3b
  • inputValidation.warningBorder#a06e3b88
  • list.activeSelectionBackground#8a858580
  • list.activeSelectionForeground#1b1818
  • list.dropBackground#8a858577
  • list.errorForeground#ca4949
  • list.focusBackground#8a858540
  • list.focusForeground#292424
  • list.highlightForeground#5485b6
  • list.hoverBackground#8a858540
  • list.hoverForeground#292424
  • list.inactiveSelectionBackground#8a858526
  • list.inactiveSelectionForeground#292424
  • list.invalidItemForeground#bd5187
  • list.warningForeground#ca4949
  • merge.currentHeaderBackground#585050
  • merge.incomingHeaderBackground#8464c4
  • meta.objectliteral.js#8464c4
  • notificationLink.foreground#5485b6
  • notifications.background#e7dfdf
  • notifications.foreground#292424
  • panel.background#8a858540
  • panel.border#e7dfdf
  • panel.dropBackground#5485b640
  • panelTitle.activeBorder#8464c4
  • panelTitle.activeForeground#1b1818CC
  • panelTitle.inactiveForeground#655d5d
  • peekView.border#585050
  • peekViewEditor.background#e7dfdf
  • peekViewEditor.matchHighlightBackground#8464c44D
  • peekViewResult.background#f4ecec
  • peekViewResult.fileForeground#292424
  • peekViewResult.lineForeground#292424
  • peekViewResult.matchHighlightBackground#1b1818CC
  • peekViewResult.selectionBackground#e7dfdf
  • peekViewResult.selectionForeground#585050
  • peekViewTitle.background#e7dfdf
  • peekViewTitleDescription.foreground#585050
  • peekViewTitleLabel.foreground#585050
  • pickerGroup.border#e7dfdf
  • pickerGroup.foreground#292424
  • progress.background#8a8585
  • progressBar.background#7272ca88
  • punctuation.definition.generic.begin.html#bd5187
  • scrollbar.shadow#8a8585
  • scrollbarSlider.activeBackground#8a8585
  • scrollbarSlider.background#e7dfdf
  • scrollbarSlider.hoverBackground#8a858580
  • selection.background#7272ca99
  • sideBar.background#f4ecec
  • sideBar.border#8a858580
  • sideBar.foreground#8a8585
  • sideBarSectionHeader.background#8a858559
  • sideBarSectionHeader.foreground#585050
  • sideBarTitle.foreground#585050
  • source.elm#8a858580
  • statusBar.background#8a858580
  • statusBar.border#8a858540
  • statusBar.debuggingBackground#7e7777
  • statusBar.debuggingBorder#655d5d
  • statusBar.foreground#585050
  • statusBar.noFolderBackground#8a858540
  • statusBar.noFolderBorder#8a858580
  • statusBarItem.activeBackground#585050
  • statusBarItem.hoverBackground#655d5d26
  • statusBarItem.prominentBackground#655d5d40
  • statusBarItem.prominentHoverBackground#655d5d80
  • string.quoted.single.js#1b1818
  • tab.activeBackground#f4ecec
  • tab.activeBorder#f4ecec
  • tab.activeForeground#292424
  • tab.border#f4ecec
  • tab.hoverBackground#f4ecec
  • tab.inactiveBackground#e7dfdf
  • tab.inactiveForeground#7e7777
  • tab.unfocusedActiveBorder#e7dfdf
  • tab.unfocusedActiveForeground#7e7777
  • tab.unfocusedInactiveForeground#7e7777
  • terminal.ansiBlack#292424
  • terminal.ansiBlue#7272ca
  • terminal.ansiBrightBlack#e7dfdf
  • terminal.ansiBrightBlue#7e7777
  • terminal.ansiBrightCyan#8a8585
  • terminal.ansiBrightGreen#585050
  • terminal.ansiBrightMagenta#8464c4
  • terminal.ansiBrightRed#b45a3c
  • terminal.ansiBrightWhite#1b1818
  • terminal.ansiBrightYellow#655d5d
  • terminal.ansiCyan#5485b6
  • terminal.ansiGreen#4b8b8b
  • terminal.ansiMagenta#bd5187
  • terminal.ansiRed#ca4949
  • terminal.ansiWhite#585050
  • terminal.ansiYellow#a06e3b
  • terminal.background#e7dfdf
  • terminal.findMatchHighlightBackground#7272ca80
  • terminal.foreground#1b1818
  • terminal.selectionBackground#7272ca80
  • textLink.activeForeground#5485b6
  • textLink.foreground#5485b6CC
  • titleBar.activeBackground#f4ecec
  • titleBar.activeForeground#292424
  • titleBar.inactiveBackground#e7dfdf
  • walkThrough.embeddedEditorBackground#e7dfdf
  • welcomePage.buttonBackground#e7dfdf
  • welcomePage.buttonHoverBackground#e7dfdf80
  • widget.shadow#8a8585

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
#8a8585
meta.embedded, source.groovy.embedded#8a8585
comment, punctuation.definition.comment#8a8585italic
variable, string constant.other.placeholder#ca4949
constant.other.color#1b1818
invalid, invalid.illegal#1b1818
keyword, punctuation.accessor, storage.type#8464c4
storage.modifier#a06e3b
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#8a8585BF
keyword.control, constant.other.color, keyword.other.template, keyword.other.substitution#ca4949
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#ca4949
entity.name.function, meta.function-call, variable.function, support.function, keyword.other.debugger, keyword.other.special-method#8464c4
meta.block variable.other#585050
support.other.variable, string.other.link#b45a3c
constant.language, support.constant, constant.character, constant.escape, keyword.other.unit, keyword.other#4b8b8b
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#7272canormal
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#a06e3b
support.type#5485b6
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#585050
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#ca4949
variable.language#ca4949italic
entity.name.method.js#8464c4italic
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#8464c4
entity.other.attribute-name#bd5187
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name#a06e3bitalic
entity.other.attribute-name.class#8464c4
source.sass keyword.control#8464c4
markup.inserted#4b8b8b
markup.deleted#ca4949
markup.deleted.diff#ca4949
markup.inserted.diff#4b8b8b
markup.changed#bd5187
string.regexp#5485b6
constant.character.escape#5485b6
*url*, *link*, *uri*underline
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js#ca4949italic
source.js constant.other.object.key.js string.unquoted.label.js#ca4949italic
support.type.property-name.json#8464c4
support.constant.json#4b8b8b
meta.structure.dictionary.value.json string.quoted.double#bd5187
meta.structure.dictionary.json meta.structure.dictionary.value constant.language#ca4949
source.json meta.structure.dictionary.json support.type.property-name.json#8464c4
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#a06e3b
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#4b8b8b
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#8464c4
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#a06e3b
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#4b8b8b
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#4b8b8b
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#4b8b8b
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#4b8b8b
text.html.markdown, punctuation.definition.list_item.markdown#1b1818
text.html.markdown, beginning.punctuation.definition.list.markdown#585050
text.html.markdown markup.inline.raw.markdown#bd5187
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown#7e7777
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#ca4949
markup.italic.markdown#b45a3citalic
markup.bold, markup.bold string#b45a3cbold
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#b45a3cbold
markup.underline#a06e3bunderline
markup.strikestrike
markup.quote punctuation.definition.blockquote.markdown#f4ecec
markup.quote.markdown#585050
markup.quoteitalic
string.other.link.title.markdown#8464c4
markup.underline.link.markdown#7272ca
string.other.link.description.title.markdown#bd5187
constant.other.reference.link.markdown#a06e3b
markup.raw.block#bd5187
markup.raw.block.fenced.markdown#f4ecec50
punctuation.definition.fenced.markdown#f4ecec50
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end#1b1818
variable.language.fenced.markdown#7e7777
meta.separator#7e7777bold
markup.table#1b1818
token.info-token#7272ca
token.warn-token#b45a3c
token.error-token#ca4949
token.debug-token#bd5187
string#292424
string.quoted, meta.attribute-selector.css entity.other.attribute-name.attribute, variable.other.readwrite.js#292424
support.constant.math#4b8b8b
string.regexp#4b8b8b
constant.numeric, constant.character.numeric#292424BF
variable.language, variable.other#ca4949
variable.language.this.js, variable.language.this.php#ca4949
keyword#4b8b8b
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#585050italic
entity.name.class, meta.class entity.name.type.class#b45a3c
entity.name.type#585050
entity.name.function#585050
punctuation.definition.variable#585050
punctuation.section.embedded.begin, punctuation.section.embedded.end#bd5187
constant.language, punctuation.definition.constant, variable.other.constant, meta.preprocessor#4b8b8b
support.function.construct, keyword.other.new#8464c4
constant.character, constant.other#b45a3c
constant.character.escape#b45a3c
string.regexp, string.regexp keyword.other#7e7777
entity.other.inherited-class#8464c4
entity.name.tag#ca4949
punctuation.definition.tag, meta.tag#655d5d
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#4b8b8b
entity.other.attribute-name#7272ca
entity.name.tag.custom#7272ca
support.function#7272ca
punctuation.separator.continuation#ca4949
invalid.broken#292424
invalid.unimplemented#1b1818
invalid.illegal#1b1818
support.type, support.class#5485b6
support.variable.dom#5485b6
support.type.exception#b45a3c
support.other.variable
invalid#1b1818
invalid.deprecated#b45a3c
keyword.operator#5485b6
keyword.operator.relational#bd5187italic
keyword.operator.assignment#bd5187
keyword.operator.arithmetic#bd5187
keyword.operator.bitwise#bd5187
keyword.operator.increment#bd5187
keyword.operator.ternary#bd5187
comment.line.double-slash#8a8585
object#7272ca
constant.language.null#ca4949
meta.brace#585050
meta.delimiter.period#292424
constant.language.boolean#ca4949
object.comma#1b1818
variable.parameter.function#5485b6
support.type.vendor.property-name, support.constant.vendor.property-value, support.type.property-name, meta.property-list entity.name.tag#a06e3b
meta.property-list entity.name.tag.reference#7272ca
constant.other.color.rgb-value punctuation.definition.constant#b45a3c
meta.selector#bd5187italic
entity.other.attribute-name.id#5485b6
meta.property-name#5485b6
entity.name.tag.doctype, meta.tag.sgml.doctype#585050italic
keyword.control.operator#5485b6
keyword.operator.logical#bd5187
variable.instance, variable.other.instance, variable.readwrite.instance, variable.other.readwrite.instance, variable.other.property#4b8b8b
variable.other.object.property#292424italic
variable.other.object.js, variable.other.object.jsx, variable.object.property.js, variable.object.property.jsx#292424
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#bd5187italic
variable.interpolation#ca4949
support.variable.property#5485b6
string.template meta.template.expression#ca4949
string.template punctuation.definition.string#292424
italic#bd5187italic
bold#4b8b8bbold
quote#585050italic
raw#585050
variable.assignment.coffee#5485b6
variable.parameter.function.coffee#292424
variable.assignment.coffee#4b8b8b
variable.other.readwrite.cs#292424
entity.name.type.class.cs, storage.type.cs#8464c4
entity.name.type.namespace.cs#585050
entity.name.tag.css, entity.name.tag.less, entity.name.tag.custom.css, support.constant.property-value.css#a06e3b
entity.name.tag.wildcard.css, entity.name.tag.wildcard.less, entity.name.tag.wildcard.scss, entity.name.tag.wildcard.sass#5485b6
keyword.other.unit.css, keyword.control.at-rule.media.css#a06e3b
source.elixir support.type.elixir, source.elixir meta.module.elixir entity.name.class.elixir#8464c4
source.elixir entity.name.function#4b8b8b
source.elixir constant.other.symbol.elixir, source.elixir constant.other.keywords.elixir#7272ca
source.elixir variable.other.readwrite.module.elixir, source.elixir variable.other.readwrite.module.elixir punctuation.definition.variable.elixir#4b8b8b
source.elixir .punctuation.binary.elixir#bd5187italic
source.go meta.function-call.go#585050
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#bd5187italic
source.go constant.language.go, source.go constant.other.placeholder.go#ca4949
meta.class entity.name.type.class.js#b45a3c
meta.method.declaration storage.type.js#8464c4
terminator.js#292424
meta.js punctuation.definition.js#292424
entity.name.type.instance.jsdoc, entity.name.type.instance.phpdoc#585050
variable.other.jsdoc, variable.other.phpdoc#5485b6
variable.other.meta.import.js, meta.import.js variable.other, variable.other.meta.export.js, meta.export.js variable.other#292424
variable.parameter.function.js#8464c4
variable.js, variable.other.js#292424
entity.name.type.js, entity.name.type.module.js#b45a3c
support.class.js#292424
variable.other.ruby#292424
entity.name.type.class.ruby#b45a3c
constant.language.symbol.hashkey.ruby#4b8b8b
meta.attribute-selector.less entity.other.attribute-name.attribute#b45a3c
variable.other.php, variable.other.property.php#292424
support.class.php#b45a3c
meta.function-call.php punctuation#292424
variable.other.global.php#4b8b8b
variable.other.global.php punctuation.definition.variable#4b8b8b
constant.language.python#ca4949
variable.parameter.function.python, meta.function-call.arguments.python#8464c4
meta.function-call.python, meta.function-call.generic.python#292424
punctuation.python#292424
entity.name.function.decorator.python#4b8b8b
source.python variable.language.special#8464c4
variable.scss, variable.sass, variable.parameter.url.scss, variable.parameter.url.sass#ca4949
source.css.scss meta.at-rule variable, source.css.sass meta.at-rule variable#8464c4
meta.attribute-selector.scss entity.other.attribute-name.attribute, meta.attribute-selector.sass entity.other.attribute-name.attribute#b45a3c
entity.name.tag.scss, entity.name.tag.sass#4b8b8b
keyword.other.unit.scss, keyword.other.unit.sass#a06e3b
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#292424
entity.name.type.ts, entity.name.type.tsx#b45a3c
support.class.node.ts, support.class.node.tsx#8464c4
meta.type.parameters.ts entity.name.type, meta.type.parameters.tsx entity.name.type#585050
meta.import.ts punctuation.definition.block, meta.import.tsx punctuation.definition.block, meta.export.ts punctuation.definition.block, meta.export.tsx punctuation.definition.block#292424
meta.decorator punctuation.decorator.ts, meta.decorator punctuation.decorator.tsx#8464c4
meta.tag.js meta.jsx.children.tsx#8464c4
entity.name.tag.yaml#4b8b8b
variable.other.readwrite.js, variable.parameter#292424
support.class.component.js, support.class.component.tsx#b45a3c
meta.jsx.children, meta.jsx.children.js, meta.jsx.children.tsx#292424
meta.class entity.name.type.class.tsx#b45a3c
entity.name.type.tsx, entity.name.type.module.tsx#b45a3c
meta.method.declaration storage.type.ts, meta.method.declaration storage.type.tsx#8464c4
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#292424italic
markup.deleted#292424
markup.changed#292424
markup.inserted#292424
markup.quote#4b8b8b
markup.list#4b8b8b
markup.bold, markup.italic#b45a3c
markup.inline.raw#7e7777
markup.heading.setext#7272ca

Shiki preview

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

Loading...