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

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
#ffe6ef
meta.embedded, source.groovy.embedded#bdb3b6
comment, punctuation.definition.comment#817479italic
variable, string constant.other.placeholder#d5880b
constant.other.color#ffe6ef
invalid, invalid.illegal#f9f6f7
keyword, punctuation.accessor, storage.type#eb8275
storage.modifier#eb8275
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#6b6165
keyword.control, constant.other.color, keyword.other.template, keyword.other.substitution#d355e7
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#d5880b
entity.name.function, meta.function-call, variable.function, support.function, keyword.other.debugger, keyword.other.special-method#eb8275
meta.block variable.other#bdb3b6
support.other.variable, string.other.link#e6971a
constant.language, support.constant, constant.character, constant.escape, keyword.other.unit, keyword.other#bdb3b6
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#eb8275
support.type#d355e7
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#f39c91
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#d5880b
variable.language#d5880bitalic
entity.name.method.js#eb8275italic
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#eb8275
entity.other.attribute-name#eb8275
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name#eb8275italic
entity.other.attribute-name.class#bcb2bd
source.sass keyword.control#eb8275
markup.inserted#db75eb
markup.deleted#d5880b
markup.deleted.diff#d5880b
markup.inserted.diff#db75eb
markup.changed#eb8275
string.regexp#d355e7
constant.character.escape#d355e7
*url*, *link*, *uri*underline
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js#d5880bitalic
source.js constant.other.object.key.js string.unquoted.label.js#d5880bitalic
support.type.property-name.json#eb8275
support.constant.json#db75eb
meta.structure.dictionary.value.json string.quoted.double#eb8275
meta.structure.dictionary.json meta.structure.dictionary.value constant.language#d5880b
source.json meta.structure.dictionary.json support.type.property-name.json#eb8275
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#eb8275
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#db75eb
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#eb8275
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#eb8275
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#db75eb
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#db75eb
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#db75eb
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#db75eb
text.html.markdown, punctuation.definition.list_item.markdown#ffe6ef
text.html.markdown, beginning.punctuation.definition.list.markdown#bdb3b6
text.html.markdown markup.inline.raw.markdown#eb8275
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown#9e9498
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#d5880b
markup.italic.markdown#e6971aitalic
markup.bold, markup.bold string#e6971abold
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#e6971abold
markup.underline#eb8275underline
markup.strikestrike
markup.quote punctuation.definition.blockquote.markdown#161314
markup.quote.markdown#bdb3b6
markup.quoteitalic
string.other.link.title.markdown#eb8275
markup.underline.link.markdown#dd407c
string.other.link.description.title.markdown#eb8275
constant.other.reference.link.markdown#eb8275
markup.raw.block#eb8275
markup.raw.block.fenced.markdown#161314
punctuation.definition.fenced.markdown#161314
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end#ffe6ef
variable.language.fenced.markdown#9e9498
meta.separator#9e9498bold
markup.table#ffe6ef
token.info-token#dd407c
token.warn-token#e6971a
token.error-token#d5880b
token.debug-token#eb8275
string#e4dde0
string.quoted, meta.attribute-selector.css entity.other.attribute-name.attribute, variable.other.readwrite.js#f5a3c2
support.constant.math#db75eb
string.regexp#db75eb
constant.numeric, constant.character.numeric#e4dde0
variable.language, variable.other#d5880b
variable.language.this.js, variable.language.this.php#d5880b
keyword#db75eb
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#bdb3b6italic
entity.name.class, meta.class entity.name.type.class#e6971a
entity.name.type#bdb3b6
entity.name.function#bdb3b6
punctuation.definition.variable#bdb3b6
punctuation.section.embedded.begin, punctuation.section.embedded.end#eb75a2
constant.language, punctuation.definition.constant, variable.other.constant, meta.preprocessor#db75eb
support.function.construct, keyword.other.new#f18c7e
constant.character, constant.other#e6971a
constant.character.escape#e6971a
string.regexp, string.regexp keyword.other#9e9498
entity.other.inherited-class#eb8275
entity.name.tag#d5880b
punctuation.definition.tag, meta.tag#bdb3b6
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#db75eb
entity.other.attribute-name#eb75a2
entity.name.tag.custom#dd407c
support.function#bdb3b6
punctuation.separator.continuation#d5880b
invalid.broken#0d080a
invalid.unimplemented#ffe6ef
invalid.illegal#ffe6ef
support.type, support.class#d355e7
support.variable.dom#d355e7
support.type.exception#e6971a
support.other.variable
invalid#ffe6ef
invalid.deprecated#e6971a
keyword.operator#d355e7
keyword.operator.relational#eb8275italic
keyword.operator.assignment#eb8275
keyword.operator.arithmetic#eb8275
keyword.operator.bitwise#eb8275
keyword.operator.increment#eb8275
keyword.operator.ternary#eb8275
comment.line.double-slash#766b6f
object#dd407c
constant.language.null#d5880b
meta.brace#766b6f
meta.delimiter.period#e4dde0
constant.language.boolean#d5880b
object.comma#f9f6f7
variable.parameter.function#d355e7
support.type.vendor.property-name, support.constant.vendor.property-value, support.type.property-name, meta.property-list entity.name.tag#eb8275
meta.property-list entity.name.tag.reference#dd407c
constant.other.color.rgb-value punctuation.definition.constant#e6971a
meta.selector#eb8275italic
entity.other.attribute-name.id#dcd2d1
meta.property-name#d355e7
entity.name.tag.doctype, meta.tag.sgml.doctype#766b6fitalic
keyword.control.operator#d355e7
keyword.operator.logical#eb8275
variable.instance, variable.other.instance, variable.readwrite.instance, variable.other.readwrite.instance, variable.other.property#db75eb
variable.other.object.property#e4dde0italic
variable.other.object.js, variable.other.object.jsx, variable.object.property.js, variable.object.property.jsx#e4dde0
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#eb75a2italic
variable.interpolation#d5880b
support.variable.property#d355e7
string.template meta.template.expression#d5880b
string.template punctuation.definition.string#e4dde0
italic#eb8275italic
bold#db75ebbold
quote#766b6fitalic
raw#bdb3b6
variable.assignment.coffee#d355e7
variable.parameter.function.coffee#e4dde0
variable.assignment.coffee#db75eb
variable.other.readwrite.cs#e4dde0
entity.name.type.class.cs, storage.type.cs#eb8275
entity.name.type.namespace.cs#bdb3b6
entity.name.tag.css, entity.name.tag.less, entity.name.tag.custom.css#d9d2db
support.constant.property-value.css#e17ef1
entity.name.tag.wildcard.css, entity.name.tag.wildcard.less, entity.name.tag.wildcard.scss, entity.name.tag.wildcard.sass#d355e7
keyword.other.unit.css, keyword.control.at-rule.media.css#d355e7
source.elixir support.type.elixir, source.elixir meta.module.elixir entity.name.class.elixir#eb8275
source.elixir entity.name.function#db75eb
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#db75eb
source.elixir .punctuation.binary.elixir#eb8275italic
source.go meta.function-call.go#bdb3b6
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#eb8275italic
source.go constant.language.go, source.go constant.other.placeholder.go#d5880b
meta.class entity.name.type.class.js#e6971a
meta.method.declaration storage.type.js#bcb2bd
terminator.js#e4dde0
meta.js punctuation.definition.js#e4dde0
entity.name.type.instance.jsdoc, entity.name.type.instance.phpdoc#766b6f
variable.other.jsdoc, variable.other.phpdoc#d355e7
variable.other.meta.import.js, meta.import.js variable.other, variable.other.meta.export.js, meta.export.js variable.other#e4dde0
variable.parameter.function.js#eb8275
variable.js, variable.other.js#e4dde0
entity.name.type.js, entity.name.type.module.js#e6971a
support.class.js#e4dde0
variable.other.ruby#e4dde0
entity.name.type.class.ruby#e6971a
constant.language.symbol.hashkey.ruby#db75eb
meta.attribute-selector.less entity.other.attribute-name.attribute#e6971a
variable.other.php, variable.other.property.php#e4dde0
support.class.php#e6971a
meta.function-call.php punctuation#e4dde0
variable.other.global.php#db75eb
variable.other.global.php punctuation.definition.variable#db75eb
constant.language.python#d5880b
variable.parameter.function.python, meta.function-call.arguments.python#eb8275
meta.function-call.python, meta.function-call.generic.python#e4dde0
punctuation.python#e4dde0
entity.name.function.decorator.python#db75eb
source.python variable.language.special#eb8275
variable.scss, variable.sass, variable.parameter.url.scss, variable.parameter.url.sass#bcb2bd
source.css.scss meta.at-rule variable, source.css.sass meta.at-rule variable#eb8275
meta.attribute-selector.scss entity.other.attribute-name.attribute, meta.attribute-selector.sass entity.other.attribute-name.attribute#e6971a
entity.name.tag.scss, entity.name.tag.sass#db75eb
keyword.other.unit.scss, keyword.other.unit.sass#eb8275
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#e4dde0
entity.name.type.ts, entity.name.type.tsx#e6971a
support.class.node.ts, support.class.node.tsx#eb8275
meta.type.parameters.ts entity.name.type, meta.type.parameters.tsx entity.name.type#766b6f
meta.import.ts punctuation.definition.block, meta.import.tsx punctuation.definition.block, meta.export.ts punctuation.definition.block, meta.export.tsx punctuation.definition.block#e4dde0
meta.decorator punctuation.decorator.ts, meta.decorator punctuation.decorator.tsx#eb8275
meta.tag.js meta.jsx.children.tsx#eb8275
entity.name.tag.yaml#db75eb
variable.other.readwrite.js, variable.parameter#f17eaa
support.class.component.js, support.class.component.tsx#e6971a
meta.jsx.children, meta.jsx.children.js, meta.jsx.children.tsx#e4dde0
meta.class entity.name.type.class.tsx#e6971a
entity.name.type.tsx, entity.name.type.module.tsx#e6971a
meta.method.declaration storage.type.ts, meta.method.declaration storage.type.tsx#eb8275
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#e4dde0italic
markup.deleted#e4dde0
markup.changed#e4dde0
markup.inserted#e4dde0
markup.quote#db75eb
markup.list#db75eb
markup.bold, markup.italic#e6971a
markup.inline.raw#9e9498
markup.heading.setext#dd407c

Shiki preview

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

Loading...