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#1f292e
  • activityBar.border#161b1d
  • activityBar.dropBackground#1f292eE6
  • activityBar.foreground#7ea2b4
  • activityBarBadge.background#257fad
  • activityBarBadge.foreground#ebf8ff
  • badge.background#257fad
  • badge.foreground#c1e4f6
  • breadcrumbPicker.background#0b0d0eF2
  • button.background#257fad
  • button.foreground#c1e4f6
  • button.hoverBackground#257fad80
  • debugExceptionWidget.background#0b0d0e
  • debugExceptionWidget.border#0b0d0e80
  • debugToolBar.background#161b1d
  • descriptionForeground#c1e4f6
  • diffEditor.insertedTextBackground#568c3b23
  • diffEditor.insertedTextBorder#568c3b33
  • diffEditor.removedTextBackground#568c3b33
  • diffEditor.removedTextBorder#568c3b4D
  • dropdown.background#161b1d
  • dropdown.border#2d8f6f99
  • dropdown.foreground#c1e4f6
  • editor.background#161b1d
  • editor.findMatchBackground#7195a864
  • editor.findMatchHighlightBackground#5a7b8c64
  • editor.foreground#7ea2b4
  • editor.hoverHighlightBackground#7ea2b464
  • editor.inactiveSelectionBackground#516d7b8C
  • editor.lineHighlightBackground#1f292e
  • editor.rangeHighlightBackground#1f292e
  • editor.selectionBackground#1f292eE6
  • editor.selectionHighlightBackground#1f292e8C
  • editor.wordHighlightBackground#1f292eA6
  • editor.wordHighlightStrongBackground#1f292e8C
  • editorBracketMatch.background#0b0d0e
  • editorBracketMatch.border#516d7b80
  • editorCodeLens.foreground#7ea2b4BF
  • editorCursor.background#161b1d
  • editorCursor.foreground#7ea2b4
  • editorError.foreground#935c25
  • editorGroup.background#516d7b
  • editorGroup.border#0b0d0e
  • editorGroup.dropBackground#2d8f6f44
  • editorGroupHeader.noTabsBackground#1f292eF2
  • editorGroupHeader.tabsBackground#1f292eF2
  • editorGroupHeader.tabsBorder#0b0d0eF2
  • editorGutter.addedBackground#568c3b80
  • editorGutter.background#0b0d0e64
  • editorGutter.deletedBackground#935c25
  • editorGutter.modifiedBackground#8a8a0f
  • editorHoverWidget.background#0b0d0e
  • editorHoverWidget.border#0b0d0e80
  • editorIndentGuide.activeBackground#516d7b80
  • editorIndentGuide.background#516d7b26
  • editorLineNumber.activeForeground#7195a8
  • editorLineNumber.foreground#516d7b80
  • editorMarkerNavigation.background#161b1d
  • editorMarkerNavigationError.background#935c25
  • editorMarkerNavigationWarning.background#d22d72
  • editorOverviewRuler.commonContentForeground#b72dd2
  • editorOverviewRuler.currentContentForeground#b72dd2
  • editorOverviewRuler.incomingContentForeground#b72dd2
  • editorRuler.foreground#7ea2b480
  • editorSuggestWidget.background#1f292e
  • editorSuggestWidget.border#0b0d0e80
  • editorSuggestWidget.foreground#7ea2b4
  • editorSuggestWidget.highlightForeground#8a8a0f
  • editorSuggestWidget.selectedBackground#0b0d0e80
  • editorWarning.foreground#8a8a0f
  • editorWhitespace.foreground#516d7b64
  • editorWidget.background#0b0d0e
  • editorWidget.border#0b0d0e80
  • errorForeground#d22d7222
  • extensionButton.prominentBackground#568c3bCC
  • extensionButton.prominentForeground#ebf8ff
  • extensionButton.prominentHoverBackground#568c3b
  • focusBorder#2d8f6f66
  • foreground#7ea2b4
  • gitDecoration.addedResourceForeground#568c3b
  • gitDecoration.conflictingResourceForeground#8a8a0f
  • gitDecoration.deletedResourceForeground#d22d7290
  • gitDecoration.ignoredResourceForeground#1f292e
  • gitDecoration.modifiedResourceForeground#2d8f6f
  • gitDecoration.untrackedResourceForeground#c1e4f6
  • input.background#1f292e
  • input.border#5a7b8c
  • input.foreground#c1e4f6
  • input.placeholderForeground#7ea2b4AA
  • inputOption.activeBorder#2d8f6f99
  • inputValidation.errorBackground#d22d72
  • inputValidation.errorBorder#d22d7288
  • inputValidation.infoBackground#161b1d
  • inputValidation.infoBorder#6b6bb8
  • inputValidation.warningBackground#8a8a0f
  • inputValidation.warningBorder#8a8a0f88
  • list.activeSelectionBackground#1f292e
  • list.activeSelectionForeground#ebf8ff
  • list.dropBackground#1f292e77
  • list.errorForeground#d22d72
  • list.focusBackground#1f292eCC
  • list.focusForeground#c1e4f6CC
  • list.highlightForeground#2d8f6fCC
  • list.hoverBackground#1f292eA6
  • list.hoverForeground#c1e4f6
  • list.inactiveSelectionBackground#1f292e
  • list.inactiveSelectionForeground#7ea2b4
  • list.invalidItemForeground#b72dd2
  • list.warningForeground#d22d72
  • merge.currentHeaderBackground#516d7b
  • merge.incomingHeaderBackground#6b6bb8
  • meta.objectliteral.js#6b6bb8
  • notificationLink.foreground#2d8f6f
  • notifications.background#0b0d0e
  • notifications.foreground#c1e4f6
  • panel.background#0b0d0e80
  • panel.border#0b0d0e
  • panel.dropBackground#2d8f6f40
  • panelTitle.activeBorder#6b6bb8
  • panelTitle.activeForeground#ebf8ffCC
  • panelTitle.inactiveForeground#5a7b8c
  • peekView.border#516d7b
  • peekViewEditor.background#1f292e
  • peekViewEditor.matchHighlightBackground#6b6bb84D
  • peekViewResult.background#161b1d
  • peekViewResult.fileForeground#1f292e
  • peekViewResult.lineForeground#1f292e
  • peekViewResult.matchHighlightBackground#ebf8ffCC
  • peekViewResult.selectionBackground#1f292e
  • peekViewResult.selectionForeground#516d7b
  • peekViewTitle.background#0b0d0e
  • peekViewTitleDescription.foreground#516d7b
  • peekViewTitleLabel.foreground#516d7b
  • pickerGroup.border#0b0d0e
  • pickerGroup.foreground#c1e4f6
  • progress.background#516d7b
  • progressBar.background#257fad88
  • punctuation.definition.generic.begin.html#b72dd2
  • scrollbar.shadow#0b0d0e
  • scrollbarSlider.activeBackground#1f292e
  • scrollbarSlider.background#516d7b
  • scrollbarSlider.hoverBackground#5a7b8c
  • selection.background#257fad99
  • sideBar.background#0b0d0eFA
  • sideBar.border#1f292e80
  • sideBar.foreground#516d7b
  • sideBarSectionHeader.background#1f292e
  • sideBarSectionHeader.foreground#7ea2b4
  • sideBarTitle.foreground#7ea2b4
  • source.elm#516d7b
  • statusBar.background#161b1d
  • statusBar.border#1f292e
  • statusBar.debuggingBackground#161b1d
  • statusBar.debuggingBorder#161b1d
  • statusBar.foreground#516d7b
  • statusBar.noFolderBackground#161b1d
  • statusBar.noFolderBorder#1f292e
  • statusBarItem.activeBackground#516d7b
  • statusBarItem.hoverBackground#516d7b26
  • statusBarItem.prominentBackground#1f292e
  • statusBarItem.prominentHoverBackground#1f292e
  • string.quoted.single.js#ebf8ff
  • tab.activeBackground#161b1d
  • tab.activeBorder#0b0d0e
  • tab.activeForeground#c1e4f6
  • tab.border#161b1d
  • tab.hoverBackground#161b1d
  • tab.inactiveBackground#1f292e
  • tab.inactiveForeground#7ea2b4
  • tab.unfocusedActiveBorder#5a7b8c
  • tab.unfocusedActiveForeground#7ea2b4
  • tab.unfocusedInactiveForeground#7ea2b4
  • terminal.ansiBlack#1f292e
  • terminal.ansiBlue#257fad
  • terminal.ansiBrightBlack#516d7b
  • terminal.ansiBrightBlue#7195a8
  • terminal.ansiBrightCyan#7ea2b4
  • terminal.ansiBrightGreen#516d7b
  • terminal.ansiBrightMagenta#6b6bb8
  • terminal.ansiBrightRed#935c25
  • terminal.ansiBrightWhite#ebf8ff
  • terminal.ansiBrightYellow#5a7b8c
  • terminal.ansiCyan#2d8f6f
  • terminal.ansiGreen#568c3b
  • terminal.ansiMagenta#b72dd2
  • terminal.ansiRed#d22d72
  • terminal.ansiWhite#c1e4f6
  • terminal.ansiYellow#8a8a0f
  • terminal.background#0b0d0e
  • terminal.findMatchHighlightBackground#257fad80
  • terminal.foreground#7ea2b4
  • terminal.selectionBackground#257fad80
  • textLink.activeForeground#2d8f6f
  • textLink.foreground#2d8f6fCC
  • titleBar.activeBackground#161b1d
  • titleBar.activeForeground#c1e4f6
  • titleBar.inactiveBackground#0b0d0e
  • walkThrough.embeddedEditorBackground#0b0d0e
  • welcomePage.buttonBackground#0b0d0e
  • welcomePage.buttonHoverBackground#0b0d0e99
  • widget.shadow#0b0d0e

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
#7ea2b4
meta.embedded, source.groovy.embedded#7ea2b4
comment, punctuation.definition.comment#5a7b8citalic
variable, string constant.other.placeholder#d22d72
constant.other.color#ebf8ff
invalid, invalid.illegal#ebf8ff
keyword, punctuation.accessor, storage.type#6b6bb8
storage.modifier#8a8a0f
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#516d7b
keyword.control, constant.other.color, keyword.other.template, keyword.other.substitution#d22d72
entity.name.tag, meta.tag.sgml, markup.deleted.git_gutter#d22d72
entity.name.function, meta.function-call, variable.function, support.function, keyword.other.debugger, keyword.other.special-method#6b6bb8
meta.block variable.other#7ea2b4
support.other.variable, string.other.link#935c25
constant.language, support.constant, constant.character, constant.escape, keyword.other.unit, keyword.other#568c3b
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#257fadnormal
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#8a8a0f
support.type#2d8f6f
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#7ea2b4
entity.name.module.js, variable.import.parameter.js, variable.other.class.js#d22d72
variable.language#d22d72italic
entity.name.method.js#6b6bb8italic
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#6b6bb8
entity.other.attribute-name#b72dd2
text.html.basic entity.other.attribute-name.html, text.html.basic entity.other.attribute-name#8a8a0fitalic
entity.other.attribute-name.class#6b6bb8
source.sass keyword.control#6b6bb8
markup.inserted#568c3b
markup.deleted#d22d72
markup.deleted.diff#d22d72
markup.inserted.diff#568c3b
markup.changed#b72dd2
string.regexp#2d8f6f
constant.character.escape#2d8f6f
*url*, *link*, *uri*underline
tag.decorator.js entity.name.tag.js, tag.decorator.js punctuation.definition.tag.js#d22d72italic
source.js constant.other.object.key.js string.unquoted.label.js#d22d72italic
support.type.property-name.json#6b6bb8
support.constant.json#568c3b
meta.structure.dictionary.value.json string.quoted.double#b72dd2
meta.structure.dictionary.json meta.structure.dictionary.value constant.language#d22d72
source.json meta.structure.dictionary.json support.type.property-name.json#6b6bb8
source.json meta.structure.dictionary.json meta.structure.dictionary.value.json meta.structure.dictionary.json support.type.property-name.json#8a8a0f
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#568c3b
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#6b6bb8
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#8a8a0f
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#568c3b
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#568c3b
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#568c3b
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#568c3b
text.html.markdown, punctuation.definition.list_item.markdown#ebf8ff
text.html.markdown, beginning.punctuation.definition.list.markdown#7ea2b4
text.html.markdown markup.inline.raw.markdown#b72dd2
text.html.markdown markup.inline.raw.markdown punctuation.definition.raw.markdown#7195a8
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#d22d72
markup.italic.markdown#935c25italic
markup.bold, markup.bold string#935c25bold
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#935c25bold
markup.underline#8a8a0funderline
markup.strikestrike
markup.quote punctuation.definition.blockquote.markdown#161b1d
markup.quote.markdown#7ea2b4
markup.quoteitalic
string.other.link.title.markdown#6b6bb8
markup.underline.link.markdown#257fad
string.other.link.description.title.markdown#b72dd2
constant.other.reference.link.markdown#8a8a0f
markup.raw.block#b72dd2
markup.raw.block.fenced.markdown#161b1d50
punctuation.definition.fenced.markdown#161b1d50
markup.raw.block.fenced.markdown, variable.language.fenced.markdown, punctuation.section.class.end#ebf8ff
variable.language.fenced.markdown#7195a8
meta.separator#7195a8bold
markup.table#ebf8ff
token.info-token#257fad
token.warn-token#935c25
token.error-token#d22d72
token.debug-token#b72dd2
string#c1e4f6
string.quoted, meta.attribute-selector.css entity.other.attribute-name.attribute, variable.other.readwrite.js#c1e4f6
support.constant.math#568c3b
string.regexp#568c3b
constant.numeric, constant.character.numeric#c1e4f6BF
variable.language, variable.other#d22d72
variable.language.this.js, variable.language.this.php#d22d72
keyword#568c3b
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#7ea2b4italic
entity.name.class, meta.class entity.name.type.class#935c25
entity.name.type#7ea2b4
entity.name.function#7ea2b4
punctuation.definition.variable#7ea2b4
punctuation.section.embedded.begin, punctuation.section.embedded.end#b72dd2
constant.language, punctuation.definition.constant, variable.other.constant, meta.preprocessor#568c3b
support.function.construct, keyword.other.new#6b6bb8
constant.character, constant.other#935c25
constant.character.escape#935c25
string.regexp, string.regexp keyword.other#7195a8
entity.other.inherited-class#6b6bb8
entity.name.tag#d22d72
punctuation.definition.tag, meta.tag#5a7b8c
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#568c3b
entity.other.attribute-name#257fad
entity.name.tag.custom#257fad
support.function#257fad
punctuation.separator.continuation#d22d72
invalid.broken#0b0d0e
invalid.unimplemented#ebf8ff
invalid.illegal#ebf8ff
support.type, support.class#2d8f6f
support.variable.dom#2d8f6f
support.type.exception#935c25
support.other.variable
invalid#ebf8ff
invalid.deprecated#935c25
keyword.operator#2d8f6f
keyword.operator.relational#b72dd2italic
keyword.operator.assignment#b72dd2
keyword.operator.arithmetic#b72dd2
keyword.operator.bitwise#b72dd2
keyword.operator.increment#b72dd2
keyword.operator.ternary#b72dd2
comment.line.double-slash#516d7b
object#257fad
constant.language.null#d22d72
meta.brace#516d7b
meta.delimiter.period#c1e4f6
constant.language.boolean#d22d72
object.comma#ebf8ff
variable.parameter.function#2d8f6f
support.type.vendor.property-name, support.constant.vendor.property-value, support.type.property-name, meta.property-list entity.name.tag#8a8a0f
meta.property-list entity.name.tag.reference#257fad
constant.other.color.rgb-value punctuation.definition.constant#935c25
meta.selector#b72dd2italic
entity.other.attribute-name.id#2d8f6f
meta.property-name#2d8f6f
entity.name.tag.doctype, meta.tag.sgml.doctype#516d7bitalic
keyword.control.operator#2d8f6f
keyword.operator.logical#b72dd2
variable.instance, variable.other.instance, variable.readwrite.instance, variable.other.readwrite.instance, variable.other.property#568c3b
variable.other.object.property#c1e4f6italic
variable.other.object.js, variable.other.object.jsx, variable.object.property.js, variable.object.property.jsx#c1e4f6
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#b72dd2italic
variable.interpolation#d22d72
support.variable.property#2d8f6f
string.template meta.template.expression#d22d72
string.template punctuation.definition.string#c1e4f6
italic#b72dd2italic
bold#568c3bbold
quote#516d7bitalic
raw#7ea2b4
variable.assignment.coffee#2d8f6f
variable.parameter.function.coffee#c1e4f6
variable.assignment.coffee#568c3b
variable.other.readwrite.cs#c1e4f6
entity.name.type.class.cs, storage.type.cs#6b6bb8
entity.name.type.namespace.cs#7ea2b4
entity.name.tag.css, entity.name.tag.less, entity.name.tag.custom.css, support.constant.property-value.css#8a8a0f
entity.name.tag.wildcard.css, entity.name.tag.wildcard.less, entity.name.tag.wildcard.scss, entity.name.tag.wildcard.sass#2d8f6f
keyword.other.unit.css, keyword.control.at-rule.media.css#8a8a0f
source.elixir support.type.elixir, source.elixir meta.module.elixir entity.name.class.elixir#6b6bb8
source.elixir entity.name.function#568c3b
source.elixir constant.other.symbol.elixir, source.elixir constant.other.keywords.elixir#257fad
source.elixir variable.other.readwrite.module.elixir, source.elixir variable.other.readwrite.module.elixir punctuation.definition.variable.elixir#568c3b
source.elixir .punctuation.binary.elixir#b72dd2italic
source.go meta.function-call.go#7ea2b4
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#b72dd2italic
source.go constant.language.go, source.go constant.other.placeholder.go#d22d72
meta.class entity.name.type.class.js#935c25
meta.method.declaration storage.type.js#6b6bb8
terminator.js#c1e4f6
meta.js punctuation.definition.js#c1e4f6
entity.name.type.instance.jsdoc, entity.name.type.instance.phpdoc#516d7b
variable.other.jsdoc, variable.other.phpdoc#2d8f6f
variable.other.meta.import.js, meta.import.js variable.other, variable.other.meta.export.js, meta.export.js variable.other#c1e4f6
variable.parameter.function.js#6b6bb8
variable.js, variable.other.js#c1e4f6
entity.name.type.js, entity.name.type.module.js#935c25
support.class.js#c1e4f6
variable.other.ruby#c1e4f6
entity.name.type.class.ruby#935c25
constant.language.symbol.hashkey.ruby#568c3b
meta.attribute-selector.less entity.other.attribute-name.attribute#935c25
variable.other.php, variable.other.property.php#c1e4f6
support.class.php#935c25
meta.function-call.php punctuation#c1e4f6
variable.other.global.php#568c3b
variable.other.global.php punctuation.definition.variable#568c3b
constant.language.python#d22d72
variable.parameter.function.python, meta.function-call.arguments.python#6b6bb8
meta.function-call.python, meta.function-call.generic.python#c1e4f6
punctuation.python#c1e4f6
entity.name.function.decorator.python#568c3b
source.python variable.language.special#6b6bb8
variable.scss, variable.sass, variable.parameter.url.scss, variable.parameter.url.sass#d22d72
source.css.scss meta.at-rule variable, source.css.sass meta.at-rule variable#6b6bb8
meta.attribute-selector.scss entity.other.attribute-name.attribute, meta.attribute-selector.sass entity.other.attribute-name.attribute#935c25
entity.name.tag.scss, entity.name.tag.sass#568c3b
keyword.other.unit.scss, keyword.other.unit.sass#8a8a0f
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#c1e4f6
entity.name.type.ts, entity.name.type.tsx#935c25
support.class.node.ts, support.class.node.tsx#6b6bb8
meta.type.parameters.ts entity.name.type, meta.type.parameters.tsx entity.name.type#516d7b
meta.import.ts punctuation.definition.block, meta.import.tsx punctuation.definition.block, meta.export.ts punctuation.definition.block, meta.export.tsx punctuation.definition.block#c1e4f6
meta.decorator punctuation.decorator.ts, meta.decorator punctuation.decorator.tsx#6b6bb8
meta.tag.js meta.jsx.children.tsx#6b6bb8
entity.name.tag.yaml#568c3b
variable.other.readwrite.js, variable.parameter#c1e4f6
support.class.component.js, support.class.component.tsx#935c25
meta.jsx.children, meta.jsx.children.js, meta.jsx.children.tsx#c1e4f6
meta.class entity.name.type.class.tsx#935c25
entity.name.type.tsx, entity.name.type.module.tsx#935c25
meta.method.declaration storage.type.ts, meta.method.declaration storage.type.tsx#6b6bb8
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#c1e4f6italic
markup.deleted#c1e4f6
markup.changed#c1e4f6
markup.inserted#c1e4f6
markup.quote#568c3b
markup.list#568c3b
markup.bold, markup.italic#935c25
markup.inline.raw#7195a8
markup.heading.setext#257fad

Shiki preview

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

Loading...