SpunBeat Toothpaste

Name: SpunBeat Toothpaste
Author: olveralan

Publisher: olveralanThemes in package: 10

Beautiful creamy colors for your beautiful code, is time to expand your workflow like galaxies. Welcome to the SpunBeat Color Theme

Open in VS Code GitHub

Color themes

VS Code preview

Full workbench mockup using this variant's colors and tokenColors.

SpunBeat Toothpaste — SpunBeat Graphite

fetchUser.ts

index.ts

README.md

srccomponentsfetchUser.tsfetchUser

Problems1

Output

Debug Console

Terminal

Ports

~/my-project $ pnpm dev
▲ Next.js ready on http://localhost:3000
✓ compiled client and server successfully in 412ms
wait - compiling /theme/vscode...
~/my-project

main*

Copilot

Ln 5, Col 12

Spaces: 2

UTF-8

TypeScript

Dark+

colors

Workbench UI color keys from the theme JSON colors map.

activityBar.background#242424
activityBar.border#3D3D3D
activityBar.dropBackground#242424bf
activityBar.foreground#939293
activityBarBadge.background#F7F7F7
activityBarBadge.foreground#1E2021
badge.background#F7F7F7
badge.foreground#1E2021
button.background#1E2021
button.foreground#939293
button.hoverBackground#1E2021
debugExceptionWidget.background#1E2021
debugExceptionWidget.border#1E2021
debugToolBar.background#1E2021
descriptionForeground#939293
diffEditor.insertedTextBackground#CADBE50c
diffEditor.insertedTextBorder#00000000
diffEditor.removedTextBackground#ff61880c
diffEditor.removedTextBorder#00000000
dropdown.background#1E2021
dropdown.border#1E2021
dropdown.foreground#939293
dropdown.listBackground#1E2021
editor.background#1E2021
editor.findMatchBackground#fcfcfa26
editor.findMatchBorder#F7F7F7
editor.findMatchHighlightBackground#fcfcfa26
editor.findMatchHighlightBorder#00000000
editor.findRangeHighlightBackground#fcfcfa0c
editor.findRangeHighlightBorder#00000000
editor.foreground#fcfcfa
editor.hoverHighlightBackground#fcfcfa0c
editor.inactiveSelectionBackground#fcfcfa0c
editor.lineHighlightBackground#fcfcfa0c
editor.lineHighlightBorder#1E2021
editor.rangeHighlightBackground#242424
editor.rangeHighlightBorder#242424
editor.selectionBackground#555555
editor.selectionHighlightBackground#fcfcfa26
editor.selectionHighlightBorder#00000000
editor.wordHighlightBackground#fcfcfa26
editor.wordHighlightBorder#00000000
editor.wordHighlightStrongBackground#fcfcfa26
editor.wordHighlightStrongBorder#00000000
editorBracketMatch.background#1E2021
editorBracketMatch.border#1E2021
editorCodeLens.foreground#777777
editorCursor.background#242424
editorCursor.foreground#fcfcfa
editorError.border#00000000
editorError.foreground#CADBE5
editorGroup.background#1E2021
editorGroup.border#1E2021
editorGroup.dropBackground#1E2021bf
editorGroupHeader.noTabsBackground#1E2021
editorGroupHeader.tabsBackground#1E2021
editorGroupHeader.tabsBorder#1E2021
editorGutter.addedBackground#AEEDDA
editorGutter.background#1E2021
editorGutter.deletedBackground#CADBE5
editorGutter.modifiedBackground#7EC2FF
editorHint.border#1E2021
editorHint.foreground#F7F7F7
editorHoverWidget.background#1E2021
editorHoverWidget.border#1E2021
editorIndentGuide.background#3D3D3D
editorInfo.border#1E2021
editorInfo.foreground#7EC2FF
editorLineNumber.activeForeground#c1c0c0
editorLineNumber.foreground#5b595c
editorLink.activeForeground#7EC2FF
editorMarkerNavigation.background#1E2021
editorMarkerNavigationError.background#CADBE5
editorMarkerNavigationInfo.background#7EC2FF
editorMarkerNavigationWarning.background#F7F7F7
editorOverviewRuler.addedForeground#CADBE5
editorOverviewRuler.border#1E2021
editorOverviewRuler.currentContentForeground#1E2021
editorOverviewRuler.deletedForeground#CADBE5
editorOverviewRuler.errorForeground#CADBE5
editorOverviewRuler.findMatchForeground#fcfcfa26
editorOverviewRuler.incomingContentForeground#1E2021
editorOverviewRuler.infoForeground#7EC2FF
editorOverviewRuler.modifiedForeground#F7F7F7
editorOverviewRuler.rangeHighlightForeground#fcfcfa26
editorOverviewRuler.selectionHighlightForeground#fcfcfa26
editorOverviewRuler.warningForeground#F7F7F7
editorOverviewRuler.wordHighlightForeground#fcfcfa26
editorOverviewRuler.wordHighlightStrongForeground#fcfcfa26
editorRuler.foreground#5b595c
editorSuggestWidget.background#1E2021
editorSuggestWidget.border#1E2021
editorSuggestWidget.foreground#c1c0c0
editorSuggestWidget.highlightForeground#fcfcfa
editorSuggestWidget.selectedBackground#777777
editorWarning.border#00000000
editorWarning.foreground#F7F7F7
editorWhitespace.foreground#5b595c
editorWidget.background#1E2021
editorWidget.border#1E2021
errorForeground#CADBE5
extensionButton.prominentBackground#1E2021
extensionButton.prominentForeground#fcfcfa
extensionButton.prominentHoverBackground#5b595c
focusBorder#3D3D3D
foreground#fcfcfa
gitDecoration.conflictingResourceForeground#F7F7F7
gitDecoration.deletedResourceForeground#CADBE5
gitDecoration.ignoredResourceForeground#5b595c
gitDecoration.modifiedResourceForeground#CADBE5
gitDecoration.untrackedResourceForeground#F7F7F7
input.background#242424
input.border#1E2021
input.foreground#fcfcfa
input.placeholderForeground#5b595c
inputOption.activeBorder#5b595c
inputValidation.errorBackground#1E2021
inputValidation.errorBorder#CADBE5
inputValidation.infoBackground#1E2021
inputValidation.infoBorder#7EC2FF
inputValidation.warningBackground#1E2021
inputValidation.warningBorder#F7F7F7
list.activeSelectionBackground#F7F7F70d
list.activeSelectionForeground#F7F7F7
list.dropBackground#F7F7F706
list.errorForeground#7EC2FF
list.focusBackground#F7F7F706
list.focusForeground#CADBE5
list.highlightForeground#fcfcfa
list.hoverBackground#F7F7F706
list.hoverForeground#fcfcfa
list.inactiveFocusBackground#F7F7F706
list.inactiveSelectionBackground#F7F7F706
list.inactiveSelectionForeground#fcfcfa
list.invalidItemForeground#7EC2FF
list.warningForeground#7EC2FF
merge.border#1E2021
merge.commonContentBackground#fcfcfa0c
merge.commonHeaderBackground#fcfcfa26
merge.currentContentBackground#ff61880c
merge.currentHeaderBackground#ff618826
merge.incomingContentBackground#CADBE50c
merge.incomingHeaderBackground#CADBE526
notificationCenter.border#1E2021
notificationCenterHeader.background#1E2021
notificationCenterHeader.foreground#939293
notificationLink.foreground#F7F7F7
notifications.background#1E2021
notifications.border#1E2021
notifications.foreground#c1c0c0
notificationToast.border#1E2021
panel.background#1E2021
panel.border#3D3D3D
panel.dropBackground#1E2021bf
panelTitle.activeBorder#F7F7F7
panelTitle.activeForeground#F7F7F7
panelTitle.inactiveForeground#939293
peekView.border#3D3D3D
peekViewEditor.background#1E2021
peekViewEditor.matchHighlightBackground#5b595c
peekViewEditorGutter.background#1E2021
peekViewResult.background#1E2021
peekViewResult.fileForeground#939293
peekViewResult.lineForeground#939293
peekViewResult.matchHighlightBackground#5b595c
peekViewResult.selectionBackground#1E2021
peekViewResult.selectionForeground#fcfcfa
peekViewTitle.background#181824
peekViewTitleDescription.foreground#939293
peekViewTitleLabel.foreground#fcfcfa
pickerGroup.border#3D3D3D
pickerGroup.foreground#5b595c
progressBar.background#1E2021
scrollbar.shadow#1E2021
scrollbarSlider.activeBackground#fcfcfa12
scrollbarSlider.background#fcfcfa12
scrollbarSlider.hoverBackground#fcfcfa12
selection.background#1E2021
sideBar.background#1E2021
sideBar.border#3D3D3D
sideBar.dropBackground#1E2021bf
sideBar.foreground#939293
sideBarSectionHeader.background#1E2021
sideBarSectionHeader.foreground#777777
sideBarTitle.foreground#5b595c
statusBar.background#1E2021
statusBar.border#1E2021
statusBar.debuggingBackground#777777
statusBar.debuggingBorder#1E2021
statusBar.debuggingForeground#fcfcfa
statusBar.foreground#777777
statusBar.noFolderBackground#1E2021
statusBar.noFolderBorder#1E2021
statusBar.noFolderForeground#777777
statusBarItem.activeBackground#1E2021
statusBarItem.hoverBackground#1E2021
statusBarItem.prominentBackground#1E2021
statusBarItem.prominentHoverBackground#1E2021
tab.activeBackground#1E2021
tab.activeBorder#F7F7F7
tab.activeForeground#F7F7F7
tab.border#1E2021
tab.hoverBackground#1E2021
tab.hoverBorder#5b595c
tab.inactiveBackground#1E2021
tab.inactiveForeground#939293
tab.unfocusedActiveBorder#939293
tab.unfocusedActiveForeground#c1c0c0
tab.unfocusedHoverBackground#1E2021
tab.unfocusedHoverBorder#1E2021
tab.unfocusedInactiveForeground#939293
terminal.ansiBlack#1E2021
terminal.ansiBlue#F7F7F7
terminal.ansiBrightBlack#777777
terminal.ansiBrightBlue#F7F7F7
terminal.ansiBrightCyan#7EC2FF
terminal.ansiBrightGreen#CADBE5
terminal.ansiBrightMagenta#F7F7F7
terminal.ansiBrightRed#CADBE5
terminal.ansiBrightWhite#fcfcfa
terminal.ansiBrightYellow#F7F7F7
terminal.ansiCyan#7EC2FF
terminal.ansiGreen#CADBE5
terminal.ansiMagenta#F7F7F7
terminal.ansiRed#CADBE5
terminal.ansiWhite#fcfcfa
terminal.ansiYellow#F7F7F7
terminal.background#1E2021
terminal.foreground#fcfcfa
terminal.selectionBackground#fcfcfa26
terminalCursor.background#00000000
terminalCursor.foreground#fcfcfa
textBlockQuote.background#242424
textBlockQuote.border#242424
textCodeBlock.background#242424
textLink.activeForeground#fcfcfa
textLink.foreground#F7F7F7
textPreformat.foreground#fcfcfa
textSeparator.foreground#777777
titleBar.activeBackground#242424
titleBar.activeForeground#939293
titleBar.border#1E2021
titleBar.inactiveBackground#1E2021
titleBar.inactiveForeground#5b595c
walkThrough.embeddedEditorBackground#1E2021
welcomePage.buttonBackground#1E2021
welcomePage.buttonHoverBackground#5b595c
widget.shadow#1E2021

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment, comment keyword, comment markup.underline.link, comment string, comment punctuation.definition, comment punctuation, comment text	#7F8C98	italic
comment storage.type	#7F8C98	—
comment entity.name.type	#c1c0c0	—
comment variable, comment variable.other	#c1c0c0	—
comment keyword.codetag.notation	#F7F7F7	—
comment.git-status.header.remote	#CADBE5	—
comment.git-status.header.local	#7EC2FF	—
comment.other.git-status.head	#fcfcfa	—
constant	#F7F7F7	—
constant.other	#fcfcfa	—
constant.other.property	#F7F7F7	—
constant.other.color	#F7F7F7	—
constant.other.character-class.escape	#F7F7F7	—
constant.other.key	#F7F7F7	—
constant.other.symbol	#F7F7F7	—
constant.numeric	#F7F7F7	—
constant.language	#F7F7F7	—
constant.character.escape	#F7F7F7	—
constant.numeric.line-number.find-in-files	#5b595c	—
constant.numeric.line-number.match.find-in-files	#F7F7F7	—
entity.name.section	#F7F7F7	—
entity.name	#CADBE5	—
entity.name.class	#7EC2FF	—
entity.name.constant	#F7F7F7	—
entity.name.namespace	#fcfcfa	—
entity.other.inherited-class	#7EC2FF	italic
meta.decorator	—	italic
punctuation.decorator, meta.brace, meta.objectliteral	—	normal
entity.name.tag, entity.name.tag.js.jsx support.class.component.js.jsx	#CADBE5	—
entity.other.attribute-name	#7EC2FF	italic
entity.other.attribute-name.class.css, entity.other.attribute-name.parent-selector-suffix.css, entity.other.attribute-name.parent-selector-suffix.css punctuation.definition.entity.css	#CADBE5	—
entity.other.attribute-name.id.css	#F7F7F7	—
entity.other.attribute-name.pseudo-class.css entity.other.pseudo-class.css	#7EC2FF	italic
entity.name.function, support.function	#CADBE5	—
entity.other.git-status.hex	#F7F7F7	—
invalid	—	italic
keyword	#CADBE5	—
keyword.control	#ffd4a3	italic
keyword.control.flow	#ffd4a3	italic
keyword.operator	#CADBE5	—
keyword.other.substitution	#939293	—
keyword.other.template.begin keyword.other.template.end	#7EC2FF	—
keyword.other.important	—	italic
keyword.operator.heading.restructuredtext, keyword.operator.table.row.restructuredtext, keyword.operator.table.data.restructuredtext	#939293	—
keyword.operator.logical, keyword.operator.relational, keyword.operator.ternary, keyword.operator.comparison, keyword.operator.spread, keyword.operator.new	#7EC2FF	normal
keyword.operator.class, keyword.operator.key	#7EC2FF	normal
markup.italic	—	italic
markup.bold	—	bold
markup.heading	#F7F7F7	—
markup.raw	#F7F7F7	—
markup.underline	—	underline
markup.underline.link	#CADBE5	—
markup.inserted, markup.inserted punctuation.definition.inserted	#CADBE5	—
markup.deleted, markup.deleted punctuation.definition.deleted	#CADBE5	—
markup.changed, markup.changed punctuation.definition.changed	#F7F7F7	—
markup.ignored, markup.ignored punctuation.definition.ignored	#939293	—
markup.untracked	#939293	—
markup.quote	—	italic
meta.brace.round, meta.brace.square, meta.brace.curly, meta.delimiter.comma.js, meta.function-call.without-arguments.js, meta.function-call.method.without-arguments.js	#939293	—
meta.function-call, meta.function-call.arguments meta.function-call	#CADBE5	—
meta.function-call meta.function-call.arguments, meta.function-call meta.arguments, meta.function-call meta.group	#fcfcfa	—
meta.instance.constructor	#CADBE5	—
meta.attribute-with-value.class string	#CADBE5	—
meta.attribute-with-value.id string	#F7F7F7	—
source.json meta.structure.dictionary, source.json meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary, source.json meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary, source.json meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary, source.json meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary, source.json meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary, source.json meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary, source.json meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary, source.json meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary, source.json meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary, source.json meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary, source.json meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary, source.json meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary, source.json meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary, source.json meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary, source.json meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary, source.json meta.structure.dictionary string, source.json meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary string, source.json meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary string, source.json meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary string, source.json meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary string, source.json meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary string, source.json meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary string, source.json meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary string, source.json meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary string, source.json meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary string, source.json meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary string, source.json meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary string, source.json meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary string, source.json meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary string, source.json meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary string, source.json meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary string	#fcfcfa	—
source.json meta.structure.dictionary.value string, source.json meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value string, source.json meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value string, source.json meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value string, source.json meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value string, source.json meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value string, source.json meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value string, source.json meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value string, source.json meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value string, source.json meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value string, source.json meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value string, source.json meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value string, source.json meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value string, source.json meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value string, source.json meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value string, source.json meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value meta.structure.dictionary meta.structure.dictionary.value string	#F7F7F7	—
meta.object.member	#fcfcfa	—
meta.property-list.css variable.other	#F7F7F7	—
entity.name.constant.preprocessor, meta.preprocessor	#F7F7F7	—
meta.diff.git-diff.header	#F7F7F7	—
punctuation	#939293	—
punctuation.definition.tag, punctuation.definition.tag source, punctuation.definition.group.begin.ruby, punctuation.definition.group.end.ruby	#939293	—
punctuation.definition.group	#fcfcfa	—
punctuation.definition.comment	#7F8C98	—
punctuation.definition.variable, punctuation.definition.keyword.scss, punctuation.definition.entity.css	#c1c0c0	—
punctuation.section.embedded, punctuation.section.embedded entity.name.tag, punctuation.section.embedded constant.other, punctuation.section.embedded source	#F7F7F7	—
punctuation.template-string.element.begin, punctuation.template-string.element.end, punctuation.definition.string.template.begin, punctuation.definition.string.template.end, string.quoted.template punctuation.definition.string.begin, string.quoted.template punctuation.definition.string.end	#AEEDDA	—
string.quoted.single, string.quoted.double, string.quoted.template, string.template, meta.array.literal, constant.language.boolean, constant.numeric.decimal	#AEEDDA	—
meta.paragraph.markdown meta.dummy.line-break, meta.paragraph.markdown meta.hard-line-break.markdown	—	—
region.redish	#CADBE5	—
region.orangish	#F7F7F7	—
region.yellowish	#F7F7F7	—
region.greenish	#CADBE5	—
region.bluish	#7EC2FF	—
region.purplish	#F7F7F7	—
region.pinkish	#CADBE5	—
region.whitish	#FFFFFF	—
source	#fcfcfa	—
source.scss, source.sass	#939293	—
source.sass variable.other, source.sass variable.sass, source.scss variable.other, source.scss variable.scss, source.scss variable.sass, source.css variable.other, source.css variable.scss, source.less variable.other, source.less variable.other.less, source.less variable.declaration.less	#F7F7F7	italic
source.git-show.commit.sha	#F7F7F7	—
source.git-show.author, source.git-show.date, source.git-diff.command, source.git-diff.command meta.diff.git-diff.header.from-file, source.git-diff.command meta.diff.git-diff.header.to-file	#939293	—
source.git-show meta.diff.git-diff.header.extended.index.from-sha, source.git-show meta.diff.git-diff.header.extended.index.to-sha	#F7F7F7	—
source.git-show meta.diff.range.unified	#F7F7F7	—
source.git-show meta.diff.header.from-file, source.git-show meta.diff.header.to-file	#939293	—
storage	#CADBE5	—
storage.type	#7EC2FF	italic
storage.type.extends	#CADBE5	normal
storage.type.function.arrow	#7EC2FF	normal
storage.modifier	#AEEDDA	italic
storage.class.restructuredtext.ref	#F7F7F7	—
string	#F7F7F7	—
string.unquoted.label	#fcfcfa	—
string source	#fcfcfa	—
string source punctuation.section.embedded	#939293	—
string.other.link.title, string.other.link.description	#CADBE5	—
string.other.link.description.title	#7EC2FF	—
string.regexp punctuation.definition.string.begin, string.regexp punctuation.definition.string.end	#CADBE5	—
string.other.ref, string.other.restructuredtext.ref	#CADBE5	—
string.other.git-status.help.key	#c1c0c0	—
string.other.git-status.remote	#CADBE5	—
support.constant	#7EC2FF	—
support.constant.handlebars	#939293	—
support.function	#CADBE5	—
support.type, entity.name.type.object.console	#7EC2FF	italic
meta.type.parameters entity.name.type, meta.type.annotation entity.name.type	#ff7989	—
support.variable	#7EC2FF	—
support.type.property-name	#fcfcfa	normal
support.class	#7EC2FF	—
text	#fcfcfa	—
text.find-in-files	#fcfcfa	—
variable, variable.other	#fcfcfa	—
variable.parameter, parameters variable.function	#fcfcfa	italic
variable.language, variable.parameter.function.language.special.self.python	#c1c0c0	italic
variable.language.arguments	#ffd4a3	—
variable.other.class	#7EC2FF	—
variable.other.constant	#fcfcfa	—
meta.array-binding-pattern-variable variable.other.constant, meta.parameter.object-binding-pattern variable.parameter	#ffd4a3	—
variable.other.member	#fcfcfa	—
variable.other.property	#ffd4a3	—
variable.function	#CADBE5	—
variable.other.substitution	#F7F7F7	—
meta.object.member variable.other	#ffd4a3	—
source.ruby variable.other.readwrite.instance.ruby, source.ruby variable.other.readwrite.class.ruby	#F7F7F7	—
token.info-token	#AEEDDA	—
token.warn-token	#CADBE5	—
token.error-token	#f44747	—
token.debug-token	#b267e6	—
support.class.error, support.class.promise, entity.name.type	—	italic

Shiki preview

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

export interface User {
  id: string;
  name: string;
  role: "admin" | "member";
  tags: string[];
}

/**
 * Fetch user data by ID
 * @param id  
 * @returns User object or null if ID is invalid
 */
export async function fetchUser(id: string): Promise<User | null> {
  if (!id) {
    return null;
  }

  const response = await fetch(`/api/users/${id}`, {
    method: "GET",
    headers: { Accept: "application/json" },
  });

  if (!response.ok) {
    throw new Error(`HTTP ${response.status}`);
  }

  return (await response.json()) as User;
}

function greet(user: User): string {
  // Simple greeting function that uses the user's name
  return `Hello, ${user.name}!`;
}