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.activeBackground#ffffff
  • activityBar.background#f6f8fa
  • activityBar.border#d0d7de
  • activityBar.foreground#0891b2
  • activityBar.inactiveForeground#0e7490
  • activityBarBadge.background#0891b2
  • activityBarBadge.foreground#ffffff
  • badge.background#0891b2
  • badge.foreground#ffffff
  • breadcrumb.activeSelectionForeground#0891b2
  • breadcrumb.background#ffffff
  • breadcrumb.focusForeground#0891b2
  • breadcrumb.foreground#57606a
  • button.background#0891b2
  • button.foreground#ffffff
  • button.hoverBackground#10b981
  • button.secondaryBackground#e5e7eb
  • button.secondaryForeground#24292f
  • button.secondaryHoverBackground#d1d5db
  • checkbox.background#ffffff
  • checkbox.border#d0d7de
  • checkbox.foreground#24292f
  • debugExceptionWidget.background#ffffff
  • debugExceptionWidget.border#0891b2
  • debugToolBar.background#ffffff
  • debugToolBar.border#0891b2
  • diffEditor.border#dc2626
  • diffEditor.insertedTextBackground#10b98130
  • diffEditor.insertedTextBorder#10b98150
  • diffEditor.removedTextBackground#dc262630
  • diffEditor.removedTextBorder#dc262650
  • dropdown.background#ffffff
  • dropdown.border#d0d7de
  • dropdown.foreground#24292f
  • editor.background#ffffff
  • editor.findMatchBackground#fde047
  • editor.findMatchBorder#facc15
  • editor.findMatchHighlightBackground#dc262630
  • editor.findMatchHighlightBorder#dc262600
  • editor.findRangeHighlightBackground#0891b215
  • editor.findRangeHighlightBorder#0891b200
  • editor.foldBackground#0891b215
  • editor.foreground#0891b2
  • editor.hoverHighlightBackground#e0f2fe
  • editor.inactiveSelectionBackground#0891b215
  • editor.lineHighlightBackground#f6f8fa
  • editor.lineHighlightBorder#e0f2fe
  • editor.rangeHighlightBackground#0891b220
  • editor.rangeHighlightBorder#0891b200
  • editor.selectionBackground#0891b230
  • editor.selectionHighlightBackground#0891b220
  • editor.selectionHighlightBorder#0891b260
  • editor.wordHighlightBackground#0891b220
  • editor.wordHighlightBorder#0891b240
  • editor.wordHighlightStrongBackground#0891b230
  • editor.wordHighlightStrongBorder#0891b260
  • editorBracketMatch.background#0891b230
  • editorBracketMatch.border#0891b2
  • editorCodeLens.foreground#6e7781
  • editorCursor.background#ffffff
  • editorCursor.foreground#dc2626
  • editorError.background#dc262600
  • editorError.border#dc262600
  • editorError.foreground#dc2626
  • editorGroup.border#e0f2fe
  • editorGroup.emptyBackground#ffffff
  • editorGroupHeader.border#e0f2fe
  • editorGroupHeader.tabsBackground#f6f8fa
  • editorGutter.addedBackground#10b981
  • editorGutter.background#ffffff
  • editorGutter.commentRangeForeground#0891b2
  • editorGutter.deletedBackground#dc2626
  • editorGutter.foldingControlForeground#0891b2
  • editorGutter.modifiedBackground#0891b2
  • editorHoverWidget.background#ffffff
  • editorHoverWidget.border#d0d7de
  • editorHoverWidget.foreground#24292f
  • editorIndentGuide.activeBackground1#0891b2
  • editorIndentGuide.background1#e5e7eb
  • editorInfo.background#3b82f600
  • editorInfo.border#3b82f600
  • editorInfo.foreground#3b82f6
  • editorLineNumber.activeForeground#0891b2
  • editorLineNumber.foreground#8c959f
  • editorLink.activeForeground#dc2626
  • editorMarkerNavigation.background#ffffff
  • editorMarkerNavigationError.background#dc2626
  • editorMarkerNavigationInfo.background#3b82f6
  • editorMarkerNavigationWarning.background#ea580c
  • editorOverviewRuler.background#ffffff
  • editorOverviewRuler.border#d0d7de
  • editorRuler.foreground#e5e7eb
  • editorSuggestWidget.background#ffffff
  • editorSuggestWidget.border#d0d7de
  • editorSuggestWidget.foreground#24292f
  • editorSuggestWidget.highlightForeground#0891b2
  • editorSuggestWidget.selectedBackground#e0f2fe
  • editorWarning.background#ea580c00
  • editorWarning.border#ea580c00
  • editorWarning.foreground#ea580c
  • editorWhitespace.foreground#d0d7de
  • editorWidget.background#ffffff
  • editorWidget.foreground#24292f
  • editorWidget.resizeBorder#dc2626
  • focusBorder#0891b2
  • foreground#24292f
  • gitDecoration.addedResourceForeground#10b981
  • gitDecoration.conflictingResourceForeground#ea580c
  • gitDecoration.deletedResourceForeground#dc2626
  • gitDecoration.ignoredResourceForeground#8c959f
  • gitDecoration.modifiedResourceForeground#ea580c
  • gitDecoration.stageDeletedResourceForeground#dc2626
  • gitDecoration.stageModifiedResourceForeground#fbbf24
  • gitDecoration.submoduleResourceForeground#3b82f6
  • gitDecoration.untrackedResourceForeground#0891b2
  • icon.foreground#57606a
  • input.background#ffffff
  • input.border#d0d7de
  • input.foreground#24292f
  • input.placeholderForeground#6e7781
  • inputOption.activeBackground#0891b240
  • inputOption.activeBorder#0891b2
  • inputOption.activeForeground#0e7490
  • list.activeSelectionBackground#cff4fc
  • list.activeSelectionForeground#0e7490
  • list.dropBackground#0891b230
  • list.focusBackground#e0f2fe
  • list.focusForeground#0e7490
  • list.highlightForeground#0891b2
  • list.hoverBackground#f3f4f6
  • list.hoverForeground#24292f
  • list.inactiveSelectionBackground#e7f6f8
  • list.inactiveSelectionForeground#0891b2
  • listFilterWidget.background#dc2626
  • listFilterWidget.noMatchesOutline#dc2626
  • listFilterWidget.outline#0891b2
  • menu.background#ffffff
  • menu.border#d0d7de
  • menu.foreground#0891b2
  • menu.selectionBackground#0891b2
  • menu.selectionBorder#06b6d4
  • menu.selectionForeground#ffffff
  • menu.separatorBackground#e0f2fe
  • menubar.selectionBackground#e0f2fe
  • menubar.selectionBorder#0891b2
  • menubar.selectionForeground#0891b2
  • merge.commonContentBackground#fee2e2
  • merge.commonHeaderBackground#dc262670
  • merge.currentContentBackground#e0f2fe
  • merge.currentHeaderBackground#0e749070
  • merge.incomingContentBackground#d1fae5
  • merge.incomingHeaderBackground#10b98170
  • minimap.background#ffffff
  • minimap.errorHighlight#dc2626
  • minimap.findMatchHighlight#fde047
  • minimap.selectionHighlight#0891b240
  • minimap.warningHighlight#ea580c
  • minimapGutter.addedBackground#10b981
  • minimapGutter.deletedBackground#dc2626
  • minimapGutter.modifiedBackground#0891b2
  • notificationCenter.border#d0d7de
  • notificationCenterHeader.background#f6f8fa
  • notificationCenterHeader.foreground#24292f
  • notifications.background#ffffff
  • notifications.border#d0d7de
  • notifications.foreground#24292f
  • notificationsErrorIcon.foreground#dc2626
  • notificationsInfoIcon.foreground#3b82f6
  • notificationsWarningIcon.foreground#ea580c
  • notificationToast.border#d0d7de
  • panel.background#f6f8fa
  • panel.border#e0f2fe
  • panelSection.border#e0f2fe
  • panelTitle.activeBorder#0891b2
  • panelTitle.activeForeground#0891b2
  • panelTitle.inactiveForeground#57606a
  • peekView.border#dc2626
  • peekViewEditor.background#ffffff
  • peekViewEditor.matchHighlightBackground#fde04750
  • peekViewEditor.matchHighlightBorder#fde04700
  • peekViewEditorGutter.background#f6f8fa
  • peekViewResult.background#f6f8fa
  • peekViewResult.fileForeground#24292f
  • peekViewResult.lineForeground#57606a
  • peekViewResult.matchHighlightBackground#0891b230
  • peekViewResult.selectionBackground#0891b240
  • peekViewResult.selectionForeground#0e7490
  • peekViewTitle.background#dc2626
  • peekViewTitleDescription.foreground#ffffff
  • peekViewTitleLabel.foreground#ffffff
  • pickerGroup.border#d0d7de
  • pickerGroup.foreground#0891b2
  • progressBar.background#0891b2
  • scrollbar.shadow#0000001a
  • scrollbarSlider.activeBackground#0891b280
  • scrollbarSlider.background#0891b240
  • scrollbarSlider.hoverBackground#0891b260
  • selection.background#0891b240
  • settings.focusedRowBackground#0891b210
  • settings.headerForeground#24292f
  • sideBar.background#f6f8fa
  • sideBar.border#e0f2fe
  • sideBar.dropBackground#0891b220
  • sideBar.foreground#0e7490
  • sideBarSectionHeader.background#ffffff
  • sideBarSectionHeader.border#e0f2fe
  • sideBarSectionHeader.foreground#0891b2
  • sideBarTitle.foreground#06b6d4
  • statusBar.background#0e7490
  • statusBar.border#0e7490
  • statusBar.debuggingBackground#dc2626
  • statusBar.debuggingBorder#dc2626
  • statusBar.debuggingForeground#ffffff
  • statusBar.foreground#ffffff
  • statusBar.noFolderBackground#7c3aed
  • statusBar.noFolderBorder#7c3aed
  • statusBar.noFolderForeground#ffffff
  • statusBarItem.activeBackground#ffffff30
  • statusBarItem.hoverBackground#0891b2
  • statusBarItem.remoteBackground#dc2626
  • statusBarItem.remoteForeground#ffffff
  • tab.activeBackground#cff4fc
  • tab.activeBorder#0891b200
  • tab.activeBorderTop#0891b2
  • tab.activeForeground#0891b2
  • tab.border#e0f2fe
  • tab.hoverBackground#e0f2fe
  • tab.hoverBorder#0891b200
  • tab.hoverForeground#0891b2
  • tab.inactiveBackground#f6f8fa
  • tab.inactiveForeground#57606a
  • terminal.ansiBlack#24292f
  • terminal.ansiBlue#3b82f6
  • terminal.ansiBrightBlack#6e7781
  • terminal.ansiBrightBlue#2563eb
  • terminal.ansiBrightCyan#06b6d4
  • terminal.ansiBrightGreen#10b981
  • terminal.ansiBrightMagenta#a855f7
  • terminal.ansiBrightRed#dc2626
  • terminal.ansiBrightWhite#ffffff
  • terminal.ansiBrightYellow#facc15
  • terminal.ansiCyan#0891b2
  • terminal.ansiGreen#059669
  • terminal.ansiMagenta#9333ea
  • terminal.ansiRed#dc2626
  • terminal.ansiWhite#d1d5db
  • terminal.ansiYellow#eab308
  • terminal.border#e0f2fe
  • terminal.foreground#24292f
  • terminal.selectionBackground#0891b230
  • terminalCursor.background#dc2626
  • terminalCursor.foreground#ffffff
  • textLink.foreground#0891b2
  • titleBar.activeBackground#ffffff
  • titleBar.activeForeground#0891b2
  • titleBar.border#e0f2fe
  • titleBar.inactiveBackground#f6f8fa
  • titleBar.inactiveForeground#57606a
  • tree.indentGuidesStroke#cfe8fc
  • walkThrough.embeddedEditorBackground#f6f8fa
  • widget.shadow#00000020

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scopeforegroundfontStyle
punctuation.definition.delayed.unison,punctuation.definition.list.begin.unison,punctuation.definition.list.end.unison,punctuation.definition.ability.begin.unison,punctuation.definition.ability.end.unison,punctuation.operator.assignment.as.unison,punctuation.separator.pipe.unison,punctuation.separator.delimiter.unison,punctuation.definition.hash.unison#29ccd0
variable.other.generic-type.haskell#10a7ff
storage.type.haskell#ff88b8
support.variable.magic.python#29ccd0
punctuation.separator.period.python,punctuation.separator.element.python,punctuation.parenthesis.begin.python,punctuation.parenthesis.end.python#c0caf5
variable.parameter.function.language.special.self.python#e90e66
storage.modifier.lifetime.rust#c0caf5
support.function.std.rust#7aa2f7
entity.name.lifetime.rust#e90e66
variable.language.rust#29ccd0
support.constant.edge#10a7ff
constant.other.character-class.regexp#29ccd0
keyword.operator.quantifier.regexp#ff88b8
punctuation.definition.string.begin,punctuation.definition.string.end#565f89
variable.parameter.function#c0caf5
comment markup.link#a9b1d6
markup.changed.diff#e90e66
meta.diff.header.from-file,meta.diff.header.to-file,punctuation.definition.from-file.diff,punctuation.definition.to-file.diff#7aa2f7
markup.inserted.diff#565f89
markup.deleted.diff#29ccd0
meta.function.c,meta.function.cpp#29ccd0
punctuation.section.block.begin.bracket.curly.cpp,punctuation.section.block.end.bracket.curly.cpp,punctuation.terminator.statement.c,punctuation.section.block.begin.bracket.curly.c,punctuation.section.block.end.bracket.curly.c,punctuation.section.parens.begin.bracket.round.c,punctuation.section.parens.end.bracket.round.c,punctuation.section.parameters.begin.bracket.round.c,punctuation.section.parameters.end.bracket.round.c#c0caf5
punctuation.separator.key-value#c0caf5
keyword.operator.expression.import#7aa2f7
support.constant.math#e90e66
support.constant.property.math#ff88b8
variable.other.constant#e90e66
storage.type.annotation.java, storage.type.object.array.java#e90e66
source.java#29ccd0
punctuation.section.block.begin.java,punctuation.section.block.end.java,punctuation.definition.method-parameters.begin.java,punctuation.definition.method-parameters.end.java,meta.method.identifier.java,punctuation.section.method.begin.java,punctuation.section.method.end.java,punctuation.terminator.java,punctuation.section.class.begin.java,punctuation.section.class.end.java,punctuation.section.inner-class.begin.java,punctuation.section.inner-class.end.java,meta.method-call.java,punctuation.section.class.begin.bracket.curly.java,punctuation.section.class.end.bracket.curly.java,punctuation.section.method.begin.bracket.curly.java,punctuation.section.method.end.bracket.curly.java,punctuation.separator.period.java,punctuation.bracket.angle.java,punctuation.definition.annotation.java,meta.method.body.java#c0caf5
meta.method.java#7aa2f7
storage.modifier.import.java,storage.type.java,storage.type.generic.java#e90e66
keyword.operator.instanceof.java#10a7ff
meta.definition.variable.name.java#29ccd0
keyword.operator.logical#1a1b26
keyword.operator.bitwise#1a1b26
keyword.operator.channel#1a1b26
support.constant.property-value.scss,support.constant.property-value.css#ff88b8
keyword.operator.css,keyword.operator.scss,keyword.operator.less#1a1b26
support.constant.color.w3c-standard-color-name.css,support.constant.color.w3c-standard-color-name.scss#ff88b8
punctuation.separator.list.comma.css#c0caf5
support.constant.color.w3c-standard-color-name.css#ff88b8
support.type.vendored.property-name.css#1a1b26
support.module.node,support.type.object.module,support.module.node#e90e66
entity.name.type.module#e90e66
variable.other.readwrite,meta.object-literal.key,support.variable.property,support.variable.object.process,support.variable.object.node#29ccd0
support.constant.json#ff88b8
keyword.operator.expression.instanceof, keyword.operator.new, keyword.operator.ternary, keyword.operator.optional, keyword.operator.expression.keyof#10a7ff
support.type.object.console#29ccd0
support.variable.property.process#ff88b8
entity.name.function,support.function.console#7aa2f7
keyword.operator.misc.rust#c0caf5
keyword.operator.sigil.rust#10a7ff
keyword.operator.delete#10a7ff
support.type.object.dom#1a1b26
support.variable.dom,support.variable.property.dom#29ccd0
keyword.operator.arithmetic,keyword.operator.comparison,keyword.operator.decrement,keyword.operator.increment,keyword.operator.relational#1a1b26
keyword.operator.assignment.c,keyword.operator.comparison.c,keyword.operator.c,keyword.operator.increment.c,keyword.operator.decrement.c,keyword.operator.bitwise.shift.c,keyword.operator.assignment.cpp,keyword.operator.comparison.cpp,keyword.operator.cpp,keyword.operator.increment.cpp,keyword.operator.decrement.cpp,keyword.operator.bitwise.shift.cpp#10a7ff
punctuation.separator.delimiter#c0caf5
punctuation.separator.c,punctuation.separator.cpp#10a7ff
support.type.posix-reserved.c,support.type.posix-reserved.cpp#1a1b26
keyword.operator.sizeof.c,keyword.operator.sizeof.cpp#10a7ff
variable.parameter.function.language.python#ff88b8
support.type.python#1a1b26
keyword.operator.logical.python#10a7ff
variable.parameter.function.python#ff88b8
punctuation.definition.arguments.begin.python,punctuation.definition.arguments.end.python,punctuation.separator.arguments.python,punctuation.definition.list.begin.python,punctuation.definition.list.end.python#c0caf5
meta.function-call.generic.python#7aa2f7
constant.character.format.placeholder.other.python#ff88b8
keyword.operator#c0caf5
keyword.operator.assignment.compound#10a7ff
keyword.operator.assignment.compound.js,keyword.operator.assignment.compound.ts#1a1b26
keyword#10a7ff
entity.name.namespace#e90e66
variable#29ccd0
variable.c#c0caf5
variable.language#e90e66
token.variable.parameter.java#c0caf5
import.storage.java#e90e66
token.package.keyword#10a7ff
token.package#c0caf5
entity.name.function, meta.require, support.function.any-method, variable.function#7aa2f7
entity.name.type.namespace#e90e66
support.class, entity.name.type.class#e90e66
entity.name.class.identifier.namespace.type#e90e66
entity.name.class, variable.other.class.js, variable.other.class.ts#e90e66
variable.other.class.php#29ccd0
entity.name.type#e90e66
keyword.control#10a7ff
control.elements, keyword.operator.less#ff88b8
keyword.other.special-method#7aa2f7
storage#10a7ff
token.storage#10a7ff
keyword.operator.expression.delete,keyword.operator.expression.in,keyword.operator.expression.of,keyword.operator.expression.instanceof,keyword.operator.new,keyword.operator.expression.typeof,keyword.operator.expression.void#10a7ff
token.storage.type.java#e90e66
support.function#1a1b26
support.type.property-name#c0caf5
support.constant.property-value#c0caf5
support.constant.font-name#ff88b8
meta.tag#c0caf5
string#565f89
entity.other.inherited-class#e90e66
constant.other.symbol#1a1b26
constant.numeric#ff88b8
constant#ff88b8
punctuation.definition.constant#ff88b8
entity.name.tag#29ccd0
entity.other.attribute-name#ff88b8
entity.other.attribute-name.id#7aa2f7normal
entity.other.attribute-name.class.css#ff88b8normal
meta.selector#10a7ff
markup.heading#29ccd0
markup.heading punctuation.definition.heading, entity.name.section#7aa2f7
keyword.other.unit#29ccd0
markup.bold,todo.bold#ff88b8
punctuation.definition.bold#e90e66
markup.italic, punctuation.definition.italic,todo.emphasis#10a7ff
emphasis md#10a7ff
entity.name.section.markdown#29ccd0
punctuation.definition.heading.markdown#29ccd0
punctuation.definition.list.begin.markdown#29ccd0
markup.heading.setext#c0caf5
punctuation.definition.bold.markdown#ff88b8
markup.inline.raw.markdown#565f89
markup.inline.raw.string.markdown#565f89
punctuation.definition.list.markdown#29ccd0
punctuation.definition.string.begin.markdown, punctuation.definition.string.end.markdown, punctuation.definition.metadata.markdown#29ccd0
beginning.punctuation.definition.list.markdown#29ccd0
punctuation.definition.metadata.markdown#29ccd0
markup.underline.link.markdown,markup.underline.link.image.markdown#10a7ff
string.other.link.title.markdown,string.other.link.description.markdown#7aa2f7
string.regexp#1a1b26
constant.character.escape#1a1b26
punctuation.section.embedded, variable.interpolation#29ccd0
punctuation.section.embedded.begin,punctuation.section.embedded.end#10a7ff
invalid.illegal#ffffff
invalid.illegal.bad-ampersand.html#c0caf5
invalid.broken#ffffff
invalid.deprecated#ffffff
invalid.unimplemented#ffffff
source.json meta.structure.dictionary.json > string.quoted.json#29ccd0
source.json meta.structure.dictionary.json > string.quoted.json > punctuation.string#29ccd0
source.json meta.structure.dictionary.json > value.json > string.quoted.json,source.json meta.structure.array.json > value.json > string.quoted.json,source.json meta.structure.dictionary.json > value.json > string.quoted.json > punctuation,source.json meta.structure.array.json > value.json > string.quoted.json > punctuation#565f89
source.json meta.structure.dictionary.json > constant.language.json,source.json meta.structure.array.json > constant.language.json#1a1b26
support.type.property-name.json#29ccd0
support.type.property-name.json punctuation#29ccd0
text.html.laravel-blade source.php.embedded.line.html entity.name.tag.laravel-blade#10a7ff
text.html.laravel-blade source.php.embedded.line.html support.constant.laravel-blade#10a7ff
support.other.namespace.use.php,support.other.namespace.use-as.php,support.other.namespace.php,entity.other.alias.php,meta.interface.php#e90e66
keyword.operator.error-control.php#10a7ff
keyword.operator.type.php#10a7ff
punctuation.section.array.begin.php#c0caf5
punctuation.section.array.end.php#c0caf5
invalid.illegal.non-null-typehinted.php#f44747
storage.type.php,meta.other.type.phpdoc.php,keyword.other.type.php,keyword.other.array.phpdoc.php#e90e66
meta.function-call.php,meta.function-call.object.php,meta.function-call.static.php#7aa2f7
punctuation.definition.parameters.begin.bracket.round.php,punctuation.definition.parameters.end.bracket.round.php,punctuation.separator.delimiter.php,punctuation.section.scope.begin.php,punctuation.section.scope.end.php,punctuation.terminator.expression.php,punctuation.definition.arguments.begin.bracket.round.php,punctuation.definition.arguments.end.bracket.round.php,punctuation.definition.storage-type.begin.bracket.round.php,punctuation.definition.storage-type.end.bracket.round.php,punctuation.definition.array.begin.bracket.round.php,punctuation.definition.array.end.bracket.round.php,punctuation.definition.begin.bracket.round.php,punctuation.definition.end.bracket.round.php,punctuation.definition.begin.bracket.curly.php,punctuation.definition.end.bracket.curly.php,punctuation.definition.section.switch-block.end.bracket.curly.php,punctuation.definition.section.switch-block.start.bracket.curly.php,punctuation.definition.section.switch-block.begin.bracket.curly.php,punctuation.definition.section.switch-block.end.bracket.curly.php#c0caf5
support.constant.core.rust#ff88b8
support.constant.ext.php,support.constant.std.php,support.constant.core.php,support.constant.parser-token.php#ff88b8
entity.name.goto-label.php,support.other.php#7aa2f7
keyword.operator.logical.php,keyword.operator.bitwise.php,keyword.operator.arithmetic.php#1a1b26
keyword.operator.regexp.php#10a7ff
keyword.operator.comparison.php#1a1b26
keyword.operator.heredoc.php,keyword.operator.nowdoc.php#10a7ff
meta.function.decorator.python#7aa2f7
support.token.decorator.python,meta.function.decorator.identifier.python#1a1b26
function.parameter#c0caf5
function.brace#c0caf5
function.parameter.ruby, function.parameter.cs#c0caf5
constant.language.symbol.ruby#1a1b26
rgb-value#1a1b26
inline-color-decoration rgb-value#ff88b8
less rgb-value#ff88b8
selector.sass#29ccd0
support.type.primitive.ts,support.type.builtin.ts,support.type.primitive.tsx,support.type.builtin.tsx#e90e66
block.scope.end,block.scope.begin#c0caf5
storage.type.cs#e90e66
entity.name.variable.local.cs#29ccd0
token.info-token#7aa2f7
token.warn-token#ff88b8
token.error-token#f44747
token.debug-token#10a7ff
punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.section.embedded#10a7ff
meta.template.expression#c0caf5
keyword.operator.module#10a7ff
support.type.type.flowtype#7aa2f7
support.type.primitive#e90e66
meta.property.object#29ccd0
variable.parameter.function.js#29ccd0
keyword.other.template.begin#565f89
keyword.other.template.end#565f89
keyword.other.substitution.begin#565f89
keyword.other.substitution.end#565f89
keyword.operator.assignment#1a1b26
keyword.operator.assignment.go#e90e66
keyword.operator.arithmetic.go, keyword.operator.address.go#10a7ff
entity.name.package.go#e90e66
support.type.prelude.elm#1a1b26
support.constant.elm#ff88b8
punctuation.quasi.element#10a7ff
constant.character.entity#29ccd0
entity.other.attribute-name.pseudo-element, entity.other.attribute-name.pseudo-class#1a1b26
entity.global.clojure#e90e66
meta.symbol.clojure#29ccd0
constant.keyword.clojure#1a1b26
meta.arguments.coffee, variable.parameter.function.coffee#29ccd0
source.ini#565f89
meta.scope.prerequisites.makefile#29ccd0
source.makefile#e90e66
storage.modifier.import.groovy#e90e66
meta.method.groovy#7aa2f7
meta.definition.variable.name.groovy#29ccd0
meta.definition.class.inherited.classes.groovy#565f89
support.variable.semantic.hlsl#e90e66
support.type.texture.hlsl, support.type.sampler.hlsl, support.type.object.hlsl, support.type.object.rw.hlsl, support.type.fx.hlsl, support.type.object.hlsl#10a7ff
text.variable, text.bracketed#29ccd0
support.type.swift, support.type.vb.asp#e90e66
entity.name.function.xi#e90e66
entity.name.class.xi#1a1b26
constant.character.character-class.regexp.xi#29ccd0
constant.regexp.xi#10a7ff
keyword.control.xi#1a1b26
invalid.xi#c0caf5
beginning.punctuation.definition.quote.markdown.xi#565f89
beginning.punctuation.definition.list.markdown.xi#a9b1d6
constant.character.xi#7aa2f7
accent.xi#7aa2f7
wikiword.xi#ff88b8
constant.other.color.rgb-value.xi#ffffff
punctuation.definition.tag.xi#a9b1d6
entity.name.label.cs, entity.name.scope-resolution.function.call, entity.name.scope-resolution.function.definition#e90e66
entity.name.label.cs, markup.heading.setext.1.markdown, markup.heading.setext.2.markdown#29ccd0
meta.brace.square#c0caf5
comment, punctuation.definition.comment#a9b1d6italic
markup.quote.markdown#a9b1d6
punctuation.definition.block.sequence.item.yaml#c0caf5
constant.language.symbol.elixir#1a1b26
entity.other.attribute-name.js,entity.other.attribute-name.ts,entity.other.attribute-name.jsx,entity.other.attribute-name.tsx,variable.parameter,variable.language.superitalic
comment.line.double-slash,comment.block.documentationitalic
keyword.control.import.python,keyword.control.flow.pythonitalic
markup.italic.markdownitalic

Shiki preview

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

Loading...