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#d0c7d1
  • activityBar.border#c6bcc7
  • activityBar.dropBackground#d9d2db
  • activityBar.foreground#353036
  • activityBarBadge.background#ca45de
  • activityBarBadge.foreground#fce6ff
  • badge.background#ca45de
  • badge.foreground#fce6ff
  • breadcrumbPicker.background#f8f6f9
  • button.background#ca45de
  • button.foreground#fce6ff
  • button.hoverBackground#ca45de
  • debugExceptionWidget.background#f8f6f9
  • debugExceptionWidget.border#f8f6f9
  • debugToolBar.background#ede8ed
  • descriptionForeground#201d20
  • diffEditor.insertedTextBackground#773cdd
  • diffEditor.insertedTextBorder#773cdd
  • diffEditor.removedTextBackground#773cdd
  • diffEditor.removedTextBorder#773cdd
  • dropdown.background#ede8ed
  • dropdown.border#d0c7d1
  • dropdown.foreground#201d20
  • editor.background#ede8ed
  • editor.findMatchBackground#746b76
  • editor.findMatchHighlightBackground#897e8b
  • editor.foreground#130415
  • editor.hoverHighlightBackground#d0c7d1
  • editor.inactiveSelectionBackground#9d949e
  • editor.lineHighlightBackground#e3dde4
  • editor.rangeHighlightBackground#d9d2db
  • editor.selectionBackground#d9d2db
  • editor.selectionHighlightBackground#d9d2db
  • editor.wordHighlightBackground#d0c7d1
  • editor.wordHighlightStrongBackground#d0c7d1
  • editorBracketMatch.background#f8f6f9
  • editorBracketMatch.border#d9d2db
  • editorCodeLens.foreground#6a616b
  • editorCursor.background#f8f6f9
  • editorCursor.foreground#aca8b3
  • editorError.foreground#b15925
  • editorGroup.background#9d949e
  • editorGroup.border#f8f6f9
  • editorGroup.dropBackground#8652e0
  • editorGroupHeader.noTabsBackground#e3dde4
  • editorGroupHeader.tabsBackground#e3dde4
  • editorGroupHeader.tabsBorder#f8f6f9
  • editorGutter.addedBackground#773cdd
  • editorGutter.background#e3dde4
  • editorGutter.deletedBackground#a05022
  • editorGutter.modifiedBackground#a82457
  • editorHoverWidget.background#f8f6f9
  • editorHoverWidget.border#f8f6f9
  • editorIndentGuide.activeBackground#d9d2db
  • editorIndentGuide.background#d0c7d1
  • editorLineNumber.activeForeground#6a616b
  • editorLineNumber.foreground#bcb2bd
  • editorMarkerNavigation.background#d0c7d1
  • editorMarkerNavigationError.background#f2b28c
  • editorMarkerNavigationWarning.background#f5a3c2
  • editorOverviewRuler.commonContentForeground#a82457
  • editorOverviewRuler.currentContentForeground#a82457
  • editorOverviewRuler.incomingContentForeground#a82457
  • editorRuler.foreground#6a616b
  • editorSuggestWidget.background#e3dde4
  • editorSuggestWidget.border#f8f6f9
  • editorSuggestWidget.foreground#6a616b
  • editorSuggestWidget.highlightForeground#773cdd
  • editorSuggestWidget.selectedBackground#f8f6f9
  • editorWarning.foreground#a82457
  • editorWhitespace.foreground#9d949e
  • editorWidget.background#f8f6f9
  • editorWidget.border#f8f6f9
  • errorForeground#c26129
  • extensionButton.prominentBackground#773cdd
  • extensionButton.prominentForeground#f8f6f9
  • extensionButton.prominentHoverBackground#773cdd
  • focusBorder#8652e0
  • foreground#130415
  • gitDecoration.addedResourceForeground#773cdd
  • gitDecoration.conflictingResourceForeground#a82457
  • gitDecoration.deletedResourceForeground#c26129
  • gitDecoration.ignoredResourceForeground#d0c7d1
  • gitDecoration.modifiedResourceForeground#8652e0
  • gitDecoration.untrackedResourceForeground#201d20
  • input.background#d0c7d1
  • input.border#897e8b
  • input.foreground#201d20
  • input.placeholderForeground#6a616b
  • inputOption.activeBorder#8652e0
  • inputValidation.errorBackground#c26129
  • inputValidation.errorBorder#c26129
  • inputValidation.infoBackground#ede8ed
  • inputValidation.infoBorder#a82457
  • inputValidation.warningBackground#a82457
  • inputValidation.warningBorder#a82457
  • list.activeSelectionBackground#d9d2db
  • list.activeSelectionForeground#0c070d
  • list.dropBackground#e3dde4
  • list.errorForeground#c26129
  • list.focusBackground#d9d2db
  • list.focusForeground#201d20
  • list.highlightForeground#8652e0
  • list.hoverBackground#d9d2db
  • list.hoverForeground#201d20
  • list.inactiveSelectionBackground#d0c7d1
  • list.inactiveSelectionForeground#6a616b
  • list.invalidItemForeground#a82457
  • list.warningForeground#c26129
  • merge.currentHeaderBackground#9d949e
  • merge.incomingHeaderBackground#a82457
  • meta.objectliteral.js#a82457
  • notificationLink.foreground#8652e0
  • notifications.background#f8f6f9
  • notifications.foreground#201d20
  • panel.background#ede8ed
  • panel.border#f8f6f9
  • panel.dropBackground#8652e0
  • panelTitle.activeBorder#a82457
  • panelTitle.activeForeground#0c070d
  • panelTitle.inactiveForeground#897e8b
  • peekView.border#9d949e
  • peekViewEditor.background#d0c7d1
  • peekViewEditor.matchHighlightBackground#a82457
  • peekViewResult.background#d0c7d1
  • peekViewResult.fileForeground#d0c7d1
  • peekViewResult.lineForeground#d0c7d1
  • peekViewResult.matchHighlightBackground#0c070d
  • peekViewResult.selectionBackground#d9d2db
  • peekViewResult.selectionForeground#9d949e
  • peekViewTitle.background#e3dde4
  • peekViewTitleDescription.foreground#9d949e
  • peekViewTitleLabel.foreground#9d949e
  • pickerGroup.border#f8f6f9
  • pickerGroup.foreground#201d20
  • progress.background#9d949e
  • progressBar.background#ca45de
  • punctuation.definition.generic.begin.html#a82457
  • scrollbar.shadow#746b76
  • scrollbarSlider.activeBackground#bcb2bd
  • scrollbarSlider.background#d0c7d1
  • scrollbarSlider.hoverBackground#c6bcc7
  • selection.background#ca45de
  • sideBar.background#ede8ed
  • sideBar.border#e3dde4
  • sideBar.foreground#746b76
  • sideBarSectionHeader.background#d9d2db
  • sideBarSectionHeader.foreground#6a616b
  • sideBarTitle.foreground#554e56
  • source.elm#9d949e
  • statusBar.background#b2a8b3
  • statusBar.border#bcb2bd
  • statusBar.debuggingBackground#a79ea9
  • statusBar.debuggingBorder#9d949e
  • statusBar.foreground#5f5760
  • statusBar.noFolderBackground#ede8ed
  • statusBar.noFolderBorder#d0c7d1
  • statusBarItem.activeBackground#9d949e
  • statusBarItem.hoverBackground#9d949e
  • statusBarItem.prominentBackground#d9d2db
  • statusBarItem.prominentHoverBackground#d0c7d1
  • string.quoted.single.js#661872
  • tab.activeBackground#ede8ed
  • tab.activeBorder#ede8ed
  • tab.activeForeground#201d20
  • tab.border#ede8ed
  • tab.hoverBackground#d9d2db
  • tab.inactiveBackground#e3dde4
  • tab.inactiveForeground#6a616b
  • tab.unfocusedActiveBorder#897e8b
  • tab.unfocusedActiveForeground#6a616b
  • tab.unfocusedInactiveForeground#6a616b
  • terminal.ansiBlack#d0c7d1
  • terminal.ansiBlue#ca45de
  • terminal.ansiBrightBlack#9d949e
  • terminal.ansiBrightBlue#746b76
  • terminal.ansiBrightCyan#6a616b
  • terminal.ansiBrightGreen#9d949e
  • terminal.ansiBrightMagenta#60575b
  • terminal.ansiBrightRed#6f645d
  • terminal.ansiBrightWhite#0c070d
  • terminal.ansiBrightYellow#897e8b
  • terminal.ansiCyan#8652e0
  • terminal.ansiGreen#773cdd
  • terminal.ansiMagenta#a82457
  • terminal.ansiRed#c26129
  • terminal.ansiWhite#201d20
  • terminal.ansiYellow#a82457
  • terminal.background#f8f6f9
  • terminal.foreground#4a444b
  • textLink.activeForeground#8652e0
  • textLink.foreground#8652e0
  • titleBar.activeBackground#ede8ed
  • titleBar.activeForeground#201d20
  • titleBar.inactiveBackground#f8f6f9
  • walkThrough.embeddedEditorBackground#f8f6f9
  • welcomePage.buttonBackground#f8f6f9
  • welcomePage.buttonHoverBackground#f8f6f9
  • widget.shadow#a79ea9

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
#0c070d
meta.embedded, source.groovy.embedded#4a444b
comment, punctuation.definition.comment#938994italic
variable, string constant.other.placeholder#c26129
constant.other.color#130415
invalid, invalid.illegal#0c070d
keyword, punctuation.accessor, storage.type#a82457
storage.modifier#a82457
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#a79ea9
keyword.control, constant.other.color, keyword.other.template, keyword.other.substitution#8652e0
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#c26129
entity.name.function, meta.function-call, variable.function, support.function, keyword.other.debugger, keyword.other.special-method#a82457
meta.block variable.other#4a444b
support.other.variable, string.other.link#a05022
constant.language, support.constant, constant.character, constant.escape, keyword.other.unit, keyword.other#554e56
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#ca45denormal
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#a82457
support.type#8652e0
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#76193d
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#c26129
variable.language#c26129italic
entity.name.method.js#a82457italic
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#a82457
entity.other.attribute-name#a82457
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name#a82457italic
entity.other.attribute-name.class#514e56
source.sass keyword.control#a82457
markup.inserted#773cdd
markup.deleted#c26129
markup.deleted.diff#c26129
markup.inserted.diff#773cdd
markup.changed#a82457
string.regexp#8652e0
constant.character.escape#8652e0
*url*, *link*, *uri*underline
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js#c26129italic
source.js constant.other.object.key.js string.unquoted.label.js#c26129italic
support.type.property-name.json#a82457
support.constant.json#773cdd
meta.structure.dictionary.value.json string.quoted.double#a82457
meta.structure.dictionary.json meta.structure.dictionary.value constant.language#c26129
source.json meta.structure.dictionary.json support.type.property-name.json#a82457
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#a82457
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#773cdd
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#a82457
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#a82457
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#773cdd
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#773cdd
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#773cdd
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#773cdd
text.html.markdown, punctuation.definition.list_item.markdown#130415
text.html.markdown, beginning.punctuation.definition.list.markdown#554e56
text.html.markdown markup.inline.raw.markdown#a82457
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown#746b76
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#c26129
markup.italic.markdown#a05022italic
markup.bold, markup.bold string#a05022bold
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#a05022bold
markup.underline#a82457underline
markup.strikestrike
markup.quote punctuation.definition.blockquote.markdown#ede8ed
markup.quote.markdown#554e56
markup.quoteitalic
string.other.link.title.markdown#a82457
markup.underline.link.markdown#ca45de
string.other.link.description.title.markdown#a82457
constant.other.reference.link.markdown#a82457
markup.raw.block#a82457
markup.raw.block.fenced.markdown#ede8ed
punctuation.definition.fenced.markdown#ede8ed
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end#130415
variable.language.fenced.markdown#746b76
meta.separator#746b76bold
markup.table#130415
token.info-token#ca45de
token.warn-token#a05022
token.error-token#c26129
token.debug-token#a82457
string#201d20
string.quoted, meta.attribute-selector.css entity.other.attribute-name.attribute, variable.other.readwrite.js#53145d
support.constant.math#773cdd
string.regexp#773cdd
constant.numeric, constant.character.numeric#201d20
variable.language, variable.other#c26129
variable.language.this.js, variable.language.this.php#c26129
keyword#773cdd
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#554e56italic
entity.name.class, meta.class entity.name.type.class#a05022
entity.name.type#554e56
entity.name.function#554e56
punctuation.definition.variable#554e56
punctuation.section.embedded.begin, punctuation.section.embedded.end#9a25ad
constant.language, punctuation.definition.constant, variable.other.constant, meta.preprocessor#773cdd
support.function.construct, keyword.other.new#931f4c
constant.character, constant.other#a05022
constant.character.escape#a05022
string.regexp, string.regexp keyword.other#746b76
entity.other.inherited-class#a82457
entity.name.tag#c26129
punctuation.definition.tag, meta.tag#554e56
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#773cdd
entity.other.attribute-name#9a25ad
entity.name.tag.custom#ca45de
support.function#554e56
punctuation.separator.continuation#c26129
invalid.broken#f8f6f9
invalid.unimplemented#130415
invalid.illegal#130415
support.type, support.class#8652e0
support.variable.dom#8652e0
support.type.exception#a05022
support.other.variable
invalid#130415
invalid.deprecated#a05022
keyword.operator#8652e0
keyword.operator.relational#a82457italic
keyword.operator.assignment#a82457
keyword.operator.arithmetic#a82457
keyword.operator.bitwise#a82457
keyword.operator.increment#a82457
keyword.operator.ternary#a82457
comment.line.double-slash#9d949e
object#ca45de
constant.language.null#c26129
meta.brace#9d949e
meta.delimiter.period#201d20
constant.language.boolean#c26129
object.comma#0c070d
variable.parameter.function#8652e0
support.type.vendor.property-name, support.constant.vendor.property-value, support.type.property-name, meta.property-list entity.name.tag#a82457
meta.property-list entity.name.tag.reference#ca45de
constant.other.color.rgb-value punctuation.definition.constant#a05022
meta.selector#a82457italic
entity.other.attribute-name.id#363032
meta.property-name#8652e0
entity.name.tag.doctype, meta.tag.sgml.doctype#9d949eitalic
keyword.control.operator#8652e0
keyword.operator.logical#a82457
variable.instance, variable.other.instance, variable.readwrite.instance, variable.other.readwrite.instance, variable.other.property#773cdd
variable.other.object.property#201d20italic
variable.other.object.js, variable.other.object.jsx, variable.object.property.js, variable.object.property.jsx#201d20
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#9a25aditalic
variable.interpolation#c26129
support.variable.property#8652e0
string.template meta.template.expression#c26129
string.template punctuation.definition.string#201d20
italic#a82457italic
bold#773cddbold
quote#9d949eitalic
raw#554e56
variable.assignment.coffee#8652e0
variable.parameter.function.coffee#201d20
variable.assignment.coffee#773cdd
variable.other.readwrite.cs#201d20
entity.name.type.class.cs, storage.type.cs#a82457
entity.name.type.namespace.cs#554e56
entity.name.tag.css, entity.name.tag.less, entity.name.tag.custom.css#28272b
support.constant.property-value.css#6b2bda
entity.name.tag.wildcard.css, entity.name.tag.wildcard.less, entity.name.tag.wildcard.scss, entity.name.tag.wildcard.sass#8652e0
keyword.other.unit.css, keyword.control.at-rule.media.css#8652e0
source.elixir support.type.elixir, source.elixir meta.module.elixir entity.name.class.elixir#a82457
source.elixir entity.name.function#773cdd
source.elixir constant.other.symbol.elixir, source.elixir constant.other.keywords.elixir#ca45de
source.elixir variable.other.readwrite.module.elixir, source.elixir variable.other.readwrite.module.elixir punctuation.definition.variable.elixir#773cdd
source.elixir .punctuation.binary.elixir#a82457italic
source.go meta.function-call.go#554e56
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#a82457italic
source.go constant.language.go, source.go constant.other.placeholder.go#c26129
meta.class entity.name.type.class.js#a05022
meta.method.declaration storage.type.js#514e56
terminator.js#201d20
meta.js punctuation.definition.js#201d20
entity.name.type.instance.jsdoc, entity.name.type.instance.phpdoc#9d949e
variable.other.jsdoc, variable.other.phpdoc#8652e0
variable.other.meta.import.js, meta.import.js variable.other, variable.other.meta.export.js, meta.export.js variable.other#201d20
variable.parameter.function.js#a82457
variable.js, variable.other.js#201d20
entity.name.type.js, entity.name.type.module.js#a05022
support.class.js#201d20
variable.other.ruby#201d20
entity.name.type.class.ruby#a05022
constant.language.symbol.hashkey.ruby#773cdd
meta.attribute-selector.less entity.other.attribute-name.attribute#a05022
variable.other.php, variable.other.property.php#201d20
support.class.php#a05022
meta.function-call.php punctuation#201d20
variable.other.global.php#773cdd
variable.other.global.php punctuation.definition.variable#773cdd
constant.language.python#c26129
variable.parameter.function.python, meta.function-call.arguments.python#a82457
meta.function-call.python, meta.function-call.generic.python#201d20
punctuation.python#201d20
entity.name.function.decorator.python#773cdd
source.python variable.language.special#a82457
variable.scss, variable.sass, variable.parameter.url.scss, variable.parameter.url.sass#514e56
source.css.scss meta.at-rule variable, source.css.sass meta.at-rule variable#a82457
meta.attribute-selector.scss entity.other.attribute-name.attribute, meta.attribute-selector.sass entity.other.attribute-name.attribute#a05022
entity.name.tag.scss, entity.name.tag.sass#773cdd
keyword.other.unit.scss, keyword.other.unit.sass#a82457
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#201d20
entity.name.type.ts, entity.name.type.tsx#a05022
support.class.node.ts, support.class.node.tsx#a82457
meta.type.parameters.ts entity.name.type, meta.type.parameters.tsx entity.name.type#9d949e
meta.import.ts punctuation.definition.block, meta.import.tsx punctuation.definition.block, meta.export.ts punctuation.definition.block, meta.export.tsx punctuation.definition.block#201d20
meta.decorator punctuation.decorator.ts, meta.decorator punctuation.decorator.tsx#a82457
meta.tag.js meta.jsx.children.tsx#a82457
entity.name.tag.yaml#773cdd
variable.other.readwrite.js, variable.parameter#841f93
support.class.component.js, support.class.component.tsx#a05022
meta.jsx.children, meta.jsx.children.js, meta.jsx.children.tsx#201d20
meta.class entity.name.type.class.tsx#a05022
entity.name.type.tsx, entity.name.type.module.tsx#a05022
meta.method.declaration storage.type.ts, meta.method.declaration storage.type.tsx#a82457
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#201d20italic
markup.deleted#201d20
markup.changed#201d20
markup.inserted#201d20
markup.quote#773cdd
markup.list#773cdd
markup.bold, markup.italic#a05022
markup.inline.raw#746b76
markup.heading.setext#ca45de

Shiki preview

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

Loading...