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#c4cad4
  • activityBar.border#b8c0cc
  • activityBar.dropBackground#d0d5dd
  • activityBar.foreground#2b313b
  • activityBarBadge.background#4287f5
  • activityBarBadge.foreground#f0f6ff
  • badge.background#4287f5
  • badge.foreground#f0f6ff
  • breadcrumbPicker.background#f6f7f9
  • button.background#4287f5
  • button.foreground#f0f6ff
  • button.hoverBackground#4287f5
  • debugExceptionWidget.background#f6f7f9
  • debugExceptionWidget.border#f6f7f9
  • debugToolBar.background#e7eaee
  • descriptionForeground#1a1d23
  • diffEditor.insertedTextBackground#007a6a
  • diffEditor.insertedTextBorder#007a6a
  • diffEditor.removedTextBackground#007a6a
  • diffEditor.removedTextBorder#007a6a
  • dropdown.background#e7eaee
  • dropdown.border#c4cad4
  • dropdown.foreground#1a1d23
  • editor.background#e7eaee
  • editor.findMatchBackground#5e6c82
  • editor.findMatchHighlightBackground#718098
  • editor.foreground#05152e
  • editor.hoverHighlightBackground#c4cad4
  • editor.inactiveSelectionBackground#8995a9
  • editor.lineHighlightBackground#dcdfe5
  • editor.rangeHighlightBackground#d0d5dd
  • editor.selectionBackground#d0d5dd
  • editor.selectionHighlightBackground#d0d5dd
  • editor.wordHighlightBackground#c4cad4
  • editor.wordHighlightStrongBackground#c4cad4
  • editorBracketMatch.background#f6f7f9
  • editorBracketMatch.border#d0d5dd
  • editorCodeLens.foreground#566276
  • editorCursor.background#f6f7f9
  • editorCursor.foreground#a4b6b4
  • editorError.foreground#9939d5
  • editorGroup.background#8995a9
  • editorGroup.border#f6f7f9
  • editorGroup.dropBackground#008a77
  • editorGroupHeader.noTabsBackground#dcdfe5
  • editorGroupHeader.tabsBackground#dcdfe5
  • editorGroupHeader.tabsBorder#f6f7f9
  • editorGutter.addedBackground#007a6a
  • editorGutter.background#dcdfe5
  • editorGutter.deletedBackground#8a2ac6
  • editorGutter.modifiedBackground#5a49df
  • editorHoverWidget.background#f6f7f9
  • editorHoverWidget.border#f6f7f9
  • editorIndentGuide.activeBackground#d0d5dd
  • editorIndentGuide.background#c4cad4
  • editorLineNumber.activeForeground#566276
  • editorLineNumber.foreground#acb5c3
  • editorMarkerNavigation.background#c4cad4
  • editorMarkerNavigationError.background#daacf6
  • editorMarkerNavigationWarning.background#c0b8f9
  • editorOverviewRuler.commonContentForeground#5a49df
  • editorOverviewRuler.currentContentForeground#5a49df
  • editorOverviewRuler.incomingContentForeground#5a49df
  • editorRuler.foreground#566276
  • editorSuggestWidget.background#dcdfe5
  • editorSuggestWidget.border#f6f7f9
  • editorSuggestWidget.foreground#566276
  • editorSuggestWidget.highlightForeground#007a6a
  • editorSuggestWidget.selectedBackground#f6f7f9
  • editorWarning.foreground#5a49df
  • editorWhitespace.foreground#8995a9
  • editorWidget.background#f6f7f9
  • editorWidget.border#f6f7f9
  • errorForeground#9e42d7
  • extensionButton.prominentBackground#007a6a
  • extensionButton.prominentForeground#f6f7f9
  • extensionButton.prominentHoverBackground#007a6a
  • focusBorder#008a77
  • foreground#05152e
  • gitDecoration.addedResourceForeground#007a6a
  • gitDecoration.conflictingResourceForeground#5a49df
  • gitDecoration.deletedResourceForeground#9e42d7
  • gitDecoration.ignoredResourceForeground#c4cad4
  • gitDecoration.modifiedResourceForeground#008a77
  • gitDecoration.untrackedResourceForeground#1a1d23
  • input.background#c4cad4
  • input.border#718098
  • input.foreground#1a1d23
  • input.placeholderForeground#566276
  • inputOption.activeBorder#008a77
  • inputValidation.errorBackground#9e42d7
  • inputValidation.errorBorder#9e42d7
  • inputValidation.infoBackground#e7eaee
  • inputValidation.infoBorder#5a49df
  • inputValidation.warningBackground#5a49df
  • inputValidation.warningBorder#5a49df
  • list.activeSelectionBackground#d0d5dd
  • list.activeSelectionForeground#07090d
  • list.dropBackground#dcdfe5
  • list.errorForeground#9e42d7
  • list.focusBackground#d0d5dd
  • list.focusForeground#1a1d23
  • list.highlightForeground#008a77
  • list.hoverBackground#d0d5dd
  • list.hoverForeground#1a1d23
  • list.inactiveSelectionBackground#c4cad4
  • list.inactiveSelectionForeground#566276
  • list.invalidItemForeground#5a49df
  • list.warningForeground#9e42d7
  • merge.currentHeaderBackground#8995a9
  • merge.incomingHeaderBackground#5a49df
  • meta.objectliteral.js#5a49df
  • notificationLink.foreground#008a77
  • notifications.background#f6f7f9
  • notifications.foreground#1a1d23
  • panel.background#e7eaee
  • panel.border#f6f7f9
  • panel.dropBackground#008a77
  • panelTitle.activeBorder#5a49df
  • panelTitle.activeForeground#07090d
  • panelTitle.inactiveForeground#718098
  • peekView.border#8995a9
  • peekViewEditor.background#c4cad4
  • peekViewEditor.matchHighlightBackground#5a49df
  • peekViewResult.background#c4cad4
  • peekViewResult.fileForeground#c4cad4
  • peekViewResult.lineForeground#c4cad4
  • peekViewResult.matchHighlightBackground#07090d
  • peekViewResult.selectionBackground#d0d5dd
  • peekViewResult.selectionForeground#8995a9
  • peekViewTitle.background#dcdfe5
  • peekViewTitleDescription.foreground#8995a9
  • peekViewTitleLabel.foreground#8995a9
  • pickerGroup.border#f6f7f9
  • pickerGroup.foreground#1a1d23
  • progress.background#8995a9
  • progressBar.background#4287f5
  • punctuation.definition.generic.begin.html#5a49df
  • scrollbar.shadow#5e6c82
  • scrollbarSlider.activeBackground#acb5c3
  • scrollbarSlider.background#c4cad4
  • scrollbarSlider.hoverBackground#b8c0cc
  • selection.background#4287f5
  • sideBar.background#e7eaee
  • sideBar.border#dcdfe5
  • sideBar.foreground#5e6c82
  • sideBarSectionHeader.background#d0d5dd
  • sideBarSectionHeader.foreground#566276
  • sideBarTitle.foreground#454f5f
  • source.elm#8995a9
  • statusBar.background#a0aaba
  • statusBar.border#acb5c3
  • statusBar.debuggingBackground#95a0b2
  • statusBar.debuggingBorder#8995a9
  • statusBar.foreground#4d586a
  • statusBar.noFolderBackground#e7eaee
  • statusBar.noFolderBorder#c4cad4
  • statusBarItem.activeBackground#8995a9
  • statusBarItem.hoverBackground#8995a9
  • statusBarItem.prominentBackground#d0d5dd
  • statusBarItem.prominentHoverBackground#c4cad4
  • string.quoted.single.js#1249a1
  • tab.activeBackground#e7eaee
  • tab.activeBorder#e7eaee
  • tab.activeForeground#1a1d23
  • tab.border#e7eaee
  • tab.hoverBackground#d0d5dd
  • tab.inactiveBackground#dcdfe5
  • tab.inactiveForeground#566276
  • tab.unfocusedActiveBorder#718098
  • tab.unfocusedActiveForeground#566276
  • tab.unfocusedInactiveForeground#566276
  • terminal.ansiBlack#c4cad4
  • terminal.ansiBlue#4287f5
  • terminal.ansiBrightBlack#8995a9
  • terminal.ansiBrightBlue#5e6c82
  • terminal.ansiBrightCyan#566276
  • terminal.ansiBrightGreen#8995a9
  • terminal.ansiBrightMagenta#585760
  • terminal.ansiBrightRed#67616b
  • terminal.ansiBrightWhite#07090d
  • terminal.ansiBrightYellow#718098
  • terminal.ansiCyan#008a77
  • terminal.ansiGreen#007a6a
  • terminal.ansiMagenta#5a49df
  • terminal.ansiRed#9e42d7
  • terminal.ansiWhite#1a1d23
  • terminal.ansiYellow#5a49df
  • terminal.background#f6f7f9
  • terminal.foreground#3c4553
  • textLink.activeForeground#008a77
  • textLink.foreground#008a77
  • titleBar.activeBackground#e7eaee
  • titleBar.activeForeground#1a1d23
  • titleBar.inactiveBackground#f6f7f9
  • walkThrough.embeddedEditorBackground#f6f7f9
  • welcomePage.buttonBackground#f6f7f9
  • welcomePage.buttonHoverBackground#f6f7f9
  • widget.shadow#95a0b2

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
#07090d
meta.embedded, source.groovy.embedded#3c4553
comment, punctuation.definition.comment#7d8ba1italic
variable, string constant.other.placeholder#9e42d7
constant.other.color#05152e
invalid, invalid.illegal#07090d
keyword, punctuation.accessor, storage.type#5a49df
storage.modifier#5a49df
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#95a0b2
keyword.control, constant.other.color, keyword.other.template, keyword.other.substitution#008a77
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#9e42d7
entity.name.function, meta.function-call, variable.function, support.function, keyword.other.debugger, keyword.other.special-method#5a49df
meta.block variable.other#3c4553
support.other.variable, string.other.link#8a2ac6
constant.language, support.constant, constant.character, constant.escape, keyword.other.unit, keyword.other#454f5f
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#4287f5normal
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#5a49df
support.type#008a77
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#3925d0
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#9e42d7
variable.language#9e42d7italic
entity.name.method.js#5a49dfitalic
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#5a49df
entity.other.attribute-name#5a49df
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name#5a49dfitalic
entity.other.attribute-name.class#495b58
source.sass keyword.control#5a49df
markup.inserted#007a6a
markup.deleted#9e42d7
markup.deleted.diff#9e42d7
markup.inserted.diff#007a6a
markup.changed#5a49df
string.regexp#008a77
constant.character.escape#008a77
*url*, *link*, *uri*underline
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js#9e42d7italic
source.js constant.other.object.key.js string.unquoted.label.js#9e42d7italic
support.type.property-name.json#5a49df
support.constant.json#007a6a
meta.structure.dictionary.value.json string.quoted.double#5a49df
meta.structure.dictionary.json meta.structure.dictionary.value constant.language#9e42d7
source.json meta.structure.dictionary.json support.type.property-name.json#5a49df
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#5a49df
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#007a6a
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#5a49df
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#5a49df
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#007a6a
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#007a6a
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#007a6a
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#007a6a
text.html.markdown, punctuation.definition.list_item.markdown#05152e
text.html.markdown, beginning.punctuation.definition.list.markdown#454f5f
text.html.markdown markup.inline.raw.markdown#5a49df
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown#5e6c82
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#9e42d7
markup.italic.markdown#8a2ac6italic
markup.bold, markup.bold string#8a2ac6bold
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#8a2ac6bold
markup.underline#5a49dfunderline
markup.strikestrike
markup.quote punctuation.definition.blockquote.markdown#e7eaee
markup.quote.markdown#454f5f
markup.quoteitalic
string.other.link.title.markdown#5a49df
markup.underline.link.markdown#4287f5
string.other.link.description.title.markdown#5a49df
constant.other.reference.link.markdown#5a49df
markup.raw.block#5a49df
markup.raw.block.fenced.markdown#e7eaee
punctuation.definition.fenced.markdown#e7eaee
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end#05152e
variable.language.fenced.markdown#5e6c82
meta.separator#5e6c82bold
markup.table#05152e
token.info-token#4287f5
token.warn-token#8a2ac6
token.error-token#9e42d7
token.debug-token#5a49df
string#1a1d23
string.quoted, meta.attribute-selector.css entity.other.attribute-name.attribute, variable.other.readwrite.js#0f3e8a
support.constant.math#007a6a
string.regexp#007a6a
constant.numeric, constant.character.numeric#1a1d23
variable.language, variable.other#9e42d7
variable.language.this.js, variable.language.this.php#9e42d7
keyword#007a6a
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#454f5fitalic
entity.name.class, meta.class entity.name.type.class#8a2ac6
entity.name.type#454f5f
entity.name.function#454f5f
punctuation.definition.variable#454f5f
punctuation.section.embedded.begin, punctuation.section.embedded.end#1a68e6
constant.language, punctuation.definition.constant, variable.other.constant, meta.preprocessor#007a6a
support.function.construct, keyword.other.new#4b38dc
constant.character, constant.other#8a2ac6
constant.character.escape#8a2ac6
string.regexp, string.regexp keyword.other#5e6c82
entity.other.inherited-class#5a49df
entity.name.tag#9e42d7
punctuation.definition.tag, meta.tag#454f5f
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#007a6a
entity.other.attribute-name#1a68e6
entity.name.tag.custom#4287f5
support.function#454f5f
punctuation.separator.continuation#9e42d7
invalid.broken#f6f7f9
invalid.unimplemented#05152e
invalid.illegal#05152e
support.type, support.class#008a77
support.variable.dom#008a77
support.type.exception#8a2ac6
support.other.variable
invalid#05152e
invalid.deprecated#8a2ac6
keyword.operator#008a77
keyword.operator.relational#5a49dfitalic
keyword.operator.assignment#5a49df
keyword.operator.arithmetic#5a49df
keyword.operator.bitwise#5a49df
keyword.operator.increment#5a49df
keyword.operator.ternary#5a49df
comment.line.double-slash#8995a9
object#4287f5
constant.language.null#9e42d7
meta.brace#8995a9
meta.delimiter.period#1a1d23
constant.language.boolean#9e42d7
object.comma#07090d
variable.parameter.function#008a77
support.type.vendor.property-name, support.constant.vendor.property-value, support.type.property-name, meta.property-list entity.name.tag#5a49df
meta.property-list entity.name.tag.reference#4287f5
constant.other.color.rgb-value punctuation.definition.constant#8a2ac6
meta.selector#5a49dfitalic
entity.other.attribute-name.id#313036
meta.property-name#008a77
entity.name.tag.doctype, meta.tag.sgml.doctype#8995a9italic
keyword.control.operator#008a77
keyword.operator.logical#5a49df
variable.instance, variable.other.instance, variable.readwrite.instance, variable.other.readwrite.instance, variable.other.property#007a6a
variable.other.object.property#1a1d23italic
variable.other.object.js, variable.other.object.jsx, variable.object.property.js, variable.object.property.jsx#1a1d23
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#1a68e6italic
variable.interpolation#9e42d7
support.variable.property#008a77
string.template meta.template.expression#9e42d7
string.template punctuation.definition.string#1a1d23
italic#5a49dfitalic
bold#007a6abold
quote#8995a9italic
raw#454f5f
variable.assignment.coffee#008a77
variable.parameter.function.coffee#1a1d23
variable.assignment.coffee#007a6a
variable.other.readwrite.cs#1a1d23
entity.name.type.class.cs, storage.type.cs#5a49df
entity.name.type.namespace.cs#454f5f
entity.name.tag.css, entity.name.tag.less, entity.name.tag.custom.css#242d2c
support.constant.property-value.css#007061
entity.name.tag.wildcard.css, entity.name.tag.wildcard.less, entity.name.tag.wildcard.scss, entity.name.tag.wildcard.sass#008a77
keyword.other.unit.css, keyword.control.at-rule.media.css#008a77
source.elixir support.type.elixir, source.elixir meta.module.elixir entity.name.class.elixir#5a49df
source.elixir entity.name.function#007a6a
source.elixir constant.other.symbol.elixir, source.elixir constant.other.keywords.elixir#4287f5
source.elixir variable.other.readwrite.module.elixir, source.elixir variable.other.readwrite.module.elixir punctuation.definition.variable.elixir#007a6a
source.elixir .punctuation.binary.elixir#5a49dfitalic
source.go meta.function-call.go#454f5f
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#5a49dfitalic
source.go constant.language.go, source.go constant.other.placeholder.go#9e42d7
meta.class entity.name.type.class.js#8a2ac6
meta.method.declaration storage.type.js#495b58
terminator.js#1a1d23
meta.js punctuation.definition.js#1a1d23
entity.name.type.instance.jsdoc, entity.name.type.instance.phpdoc#8995a9
variable.other.jsdoc, variable.other.phpdoc#008a77
variable.other.meta.import.js, meta.import.js variable.other, variable.other.meta.export.js, meta.export.js variable.other#1a1d23
variable.parameter.function.js#5a49df
variable.js, variable.other.js#1a1d23
entity.name.type.js, entity.name.type.module.js#8a2ac6
support.class.js#1a1d23
variable.other.ruby#1a1d23
entity.name.type.class.ruby#8a2ac6
constant.language.symbol.hashkey.ruby#007a6a
meta.attribute-selector.less entity.other.attribute-name.attribute#8a2ac6
variable.other.php, variable.other.property.php#1a1d23
support.class.php#8a2ac6
meta.function-call.php punctuation#1a1d23
variable.other.global.php#007a6a
variable.other.global.php punctuation.definition.variable#007a6a
constant.language.python#9e42d7
variable.parameter.function.python, meta.function-call.arguments.python#5a49df
meta.function-call.python, meta.function-call.generic.python#1a1d23
punctuation.python#1a1d23
entity.name.function.decorator.python#007a6a
source.python variable.language.special#5a49df
variable.scss, variable.sass, variable.parameter.url.scss, variable.parameter.url.sass#495b58
source.css.scss meta.at-rule variable, source.css.sass meta.at-rule variable#5a49df
meta.attribute-selector.scss entity.other.attribute-name.attribute, meta.attribute-selector.sass entity.other.attribute-name.attribute#8a2ac6
entity.name.tag.scss, entity.name.tag.sass#007a6a
keyword.other.unit.scss, keyword.other.unit.sass#5a49df
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#1a1d23
entity.name.type.ts, entity.name.type.tsx#8a2ac6
support.class.node.ts, support.class.node.tsx#5a49df
meta.type.parameters.ts entity.name.type, meta.type.parameters.tsx entity.name.type#8995a9
meta.import.ts punctuation.definition.block, meta.import.tsx punctuation.definition.block, meta.export.ts punctuation.definition.block, meta.export.tsx punctuation.definition.block#1a1d23
meta.decorator punctuation.decorator.ts, meta.decorator punctuation.decorator.tsx#5a49df
meta.tag.js meta.jsx.children.tsx#5a49df
entity.name.tag.yaml#007a6a
variable.other.readwrite.js, variable.parameter#175dcf
support.class.component.js, support.class.component.tsx#8a2ac6
meta.jsx.children, meta.jsx.children.js, meta.jsx.children.tsx#1a1d23
meta.class entity.name.type.class.tsx#8a2ac6
entity.name.type.tsx, entity.name.type.module.tsx#8a2ac6
meta.method.declaration storage.type.ts, meta.method.declaration storage.type.tsx#5a49df
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#1a1d23italic
markup.deleted#1a1d23
markup.changed#1a1d23
markup.inserted#1a1d23
markup.quote#007a6a
markup.list#007a6a
markup.bold, markup.italic#8a2ac6
markup.inline.raw#5e6c82
markup.heading.setext#4287f5

Shiki preview

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

Loading...