Kaia Theme

Name: Kaia Theme
Author: Ryan Smith

Publisher: Ryan SmithThemes in package: 2

🎨 A Monokai-inspired theme with a focus on accessible contrast ratios.

GitHub

Color themes

VS Code preview

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

Kaia Theme — Kaia

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.activeBorder#fff59d
activityBar.background#111111
activityBar.border#121212
activityBar.foreground#eeeeee
activityBar.inactiveForeground#9e9e9e
activityBarBadge.background#fff59d
activityBarBadge.foreground#212121
badge.background#fff59d
badge.foreground#212121
breadcrumb.activeSelectionForeground#f5f5f5
breadcrumb.focusForeground#9e9e9e
breadcrumb.foreground#9e9e9e
button.background#303030
button.foreground#9e9e9e
button.hoverBackground#212121
debugExceptionWidget.background#303030
debugExceptionWidget.border#212121
debugToolBar.background#303030
descriptionForeground#9e9e9e
diffEditor.insertedTextBackground#a5d6a719
diffEditor.insertedTextBorder#00000000
diffEditor.removedTextBackground#ef9a9a19
diffEditor.removedTextBorder#00000000
dropdown.background#212121
dropdown.border#212121
dropdown.foreground#9e9e9e
dropdown.listBackground#303030
editor.background#212121
editor.findMatchBackground#f5f5f526
editor.findMatchBorder#fff59d
editor.findMatchHighlightBackground#f5f5f526
editor.findMatchHighlightBorder#00000000
editor.findRangeHighlightBackground#f5f5f50c
editor.findRangeHighlightBorder#00000000
editor.foreground#f5f5f5
editor.hoverHighlightBackground#f5f5f50c
editor.inactiveSelectionBackground#f5f5f50c
editor.lineHighlightBackground#f5f5f50c
editor.lineHighlightBorder#00000000
editor.rangeHighlightBackground#303030
editor.rangeHighlightBorder#303030
editor.selectionBackground#9e9e9e26
editor.selectionHighlightBackground#f5f5f526
editor.selectionHighlightBorder#00000000
editor.wordHighlightBackground#f5f5f526
editor.wordHighlightBorder#00000000
editor.wordHighlightStrongBackground#f5f5f526
editor.wordHighlightStrongBorder#00000000
editorBracketHighlight.foreground1#b2ebf2
editorBracketHighlight.foreground2#ffecb3
editorBracketHighlight.foreground3#d1c4e9
editorBracketHighlight.foreground4#ffccbc
editorBracketHighlight.foreground5#dcedc8
editorBracketHighlight.foreground6#f8bbd0
editorBracketMatch.background#424242
editorBracketMatch.border#424242
editorCodeLens.foreground#9e9e9e
editorCursor.background#00000000
editorCursor.foreground#f5f5f5
editorError.border#00000000
editorError.foreground#ef9a9a
editorGroup.border#1a1a1a
editorGroup.dropBackground#1a1a1abf
editorGroup.emptyBackground#212121
editorGroup.focusedEmptyBorder#1a1a1a
editorGroupHeader.noTabsBackground#212121
editorGroupHeader.tabsBackground#1a1a1a
editorGroupHeader.tabsBorder#212121
editorGutter.addedBackground#a5d6a7
editorGutter.background#212121
editorGutter.deletedBackground#ef9a9a
editorGutter.modifiedBackground#ffcc80
editorHint.border#212121
editorHint.foreground#ce93d8
editorHoverWidget.background#303030
editorHoverWidget.border#212121
editorIndentGuide.background#303030
editorInfo.border#212121
editorInfo.foreground#81d4fa
editorLineNumber.activeForeground#9e9e9e
editorLineNumber.foreground#616161
editorLink.activeForeground#81d4fa
editorMarkerNavigation.background#303030
editorMarkerNavigationError.background#ef9a9a
editorMarkerNavigationInfo.background#81d4fa
editorMarkerNavigationWarning.background#ffcc80
editorOverviewRuler.addedForeground#a5d6a7
editorOverviewRuler.border#212121
editorOverviewRuler.currentContentForeground#303030
editorOverviewRuler.deletedForeground#ef9a9a
editorOverviewRuler.errorForeground#ef9a9a
editorOverviewRuler.findMatchForeground#f5f5f526
editorOverviewRuler.incomingContentForeground#303030
editorOverviewRuler.infoForeground#81d4fa
editorOverviewRuler.modifiedForeground#ffcc80
editorOverviewRuler.rangeHighlightForeground#f5f5f526
editorOverviewRuler.selectionHighlightForeground#f5f5f526
editorOverviewRuler.warningForeground#ffcc80
editorOverviewRuler.wordHighlightForeground#f5f5f526
editorOverviewRuler.wordHighlightStrongForeground#f5f5f526
editorPane.background#212121
editorRuler.foreground#616161
editorSuggestWidget.background#303030
editorSuggestWidget.border#121212
editorSuggestWidget.foreground#eeeeee
editorSuggestWidget.highlightForeground#fff9c4
editorSuggestWidget.selectedBackground#1a1a1a
editorWarning.border#00000000
editorWarning.foreground#80deea
editorWhitespace.foreground#616161
editorWidget.background#303030
editorWidget.border#303030
errorForeground#ef9a9a
extensionButton.prominentBackground#303030
extensionButton.prominentForeground#f5f5f5
extensionButton.prominentHoverBackground#616161
focusBorder#9e9e9e
foreground#f5f5f5
gitDecoration.conflictingResourceForeground#ffcc80
gitDecoration.deletedResourceForeground#ef9a9a
gitDecoration.ignoredResourceForeground#616161
gitDecoration.modifiedResourceForeground#a5d6a7
gitDecoration.untrackedResourceForeground#ffcc80
input.background#303030
input.border#303030
input.foreground#f5f5f5
input.placeholderForeground#9e9e9e
inputOption.activeBorder#616161
inputValidation.errorBackground#303030
inputValidation.errorBorder#ef9a9a
inputValidation.errorForeground#ef9a9a
inputValidation.infoBackground#303030
inputValidation.infoBorder#81d4fa
inputValidation.infoForeground#81d4fa
inputValidation.warningBackground#303030
inputValidation.warningBorder#ffcc80
inputValidation.warningForeground#ffcc80
list.activeSelectionBackground#212121
list.activeSelectionForeground#fff59d
list.dropBackground#1a1a1abf
list.errorForeground#ef9a9a
list.focusBackground#212121
list.focusForeground#f5f5f5
list.highlightForeground#f5f5f5
list.hoverBackground#1a1a1a
list.hoverForeground#f5f5f5
list.inactiveFocusBackground#373737
list.inactiveSelectionBackground#212121
list.inactiveSelectionForeground#fff59d
list.invalidItemForeground#ef9a9a
list.warningForeground#ffcc80
listFilterWidget.background#373737
listFilterWidget.noMatchesOutline#ffcdd2
listFilterWidget.outline#00000000
merge.border#212121
merge.commonContentBackground#f5f5f519
merge.commonHeaderBackground#f5f5f526
merge.currentContentBackground#ef9a9a19
merge.currentHeaderBackground#ef9a9a26
merge.incomingContentBackground#a5d6a719
merge.incomingHeaderBackground#a5d6a726
notificationCenter.border#303030
notificationCenterHeader.background#303030
notificationCenterHeader.foreground#9e9e9e
notificationLink.foreground#fff59d
notifications.background#303030
notifications.border#303030
notifications.foreground#9e9e9e
notificationToast.border#303030
panel.background#303030
panel.border#121212
panelInput.border#121212
panelTitle.activeBorder#fff59d
panelTitle.activeForeground#e0e0e0
panelTitle.inactiveForeground#9e9e9e
peekView.border#212121
peekViewEditor.background#303030
peekViewEditor.matchHighlightBackground#616161
peekViewEditorGutter.background#303030
peekViewResult.background#303030
peekViewResult.fileForeground#9e9e9e
peekViewResult.lineForeground#9e9e9e
peekViewResult.matchHighlightBackground#616161
peekViewResult.selectionBackground#303030
peekViewResult.selectionForeground#f5f5f5
peekViewTitle.background#303030
peekViewTitleDescription.foreground#9e9e9e
peekViewTitleLabel.foreground#f5f5f5
pickerGroup.border#212121
pickerGroup.foreground#616161
progressBar.background#303030
scrollbar.shadow#212121
scrollbarSlider.activeBackground#f5f5f512
scrollbarSlider.background#f5f5f512
scrollbarSlider.hoverBackground#f5f5f512
selection.background#9e9e9e26
settings.checkboxBackground#303030
settings.checkboxBorder#303030
settings.checkboxForeground#f5f5f5
settings.dropdownBackground#303030
settings.dropdownBorder#303030
settings.dropdownForeground#f5f5f5
settings.dropdownListBorder#9e9e9e
settings.headerForeground#fff59d
settings.modifiedItemIndicator#fff59d
settings.numberInputBackground#303030
settings.numberInputBorder#303030
settings.numberInputForeground#f5f5f5
settings.textInputBackground#303030
settings.textInputBorder#303030
settings.textInputForeground#f5f5f5
sideBar.background#1a1a1a
sideBar.border#121212
sideBar.dropBackground#1a1a1abf
sideBar.foreground#9e9e9e
sideBarSectionHeader.background#1a1a1a
sideBarSectionHeader.foreground#9e9e9e
sideBarTitle.foreground#616161
statusBar.background#111111
statusBar.border#121212
statusBar.debuggingBackground#424242
statusBar.debuggingBorder#121212
statusBar.debuggingForeground#bdbdbd
statusBar.foreground#9e9e9e
statusBar.noFolderBackground#111111
statusBar.noFolderBorder#121212
statusBar.noFolderForeground#9e9e9e
statusBarItem.activeBackground#212121
statusBarItem.hoverBackground#212121
statusBarItem.prominentBackground#303030
statusBarItem.prominentHoverBackground#303030
statusBarItem.remoteBackground#1a1a1a
statusBarItem.remoteForeground#9e9e9e
tab.activeBackground#212121
tab.activeBorder#212121
tab.activeBorderTop#fff59d
tab.activeForeground#eeeeee
tab.border#111111
tab.hoverBackground#212121
tab.inactiveBackground#1a1a1a
tab.inactiveForeground#9e9e9e
tab.unfocusedActiveBorder#212121
tab.unfocusedActiveBorderTop#111111
tab.unfocusedHoverBackground#212121
terminal.ansiBlack#9e9e9e
terminal.ansiBlue#2196f3
terminal.ansiBrightBlack#bdbdbd
terminal.ansiBrightBlue#bbdefb
terminal.ansiBrightCyan#b2ebf2
terminal.ansiBrightGreen#c8e6c9
terminal.ansiBrightMagenta#e1bee7
terminal.ansiBrightRed#ffcdd2
terminal.ansiBrightWhite#f5f5f5
terminal.ansiBrightYellow#fff9c4
terminal.ansiCyan#80deea
terminal.ansiGreen#c8e6c9
terminal.ansiMagenta#ce93d8
terminal.ansiRed#ef9a9a
terminal.ansiWhite#eeeeee
terminal.ansiYellow#ffeb3b
terminal.background#303030
terminal.foreground#f5f5f5
terminal.selectionBackground#f5f5f526
terminalCursor.background#00000000
terminalCursor.foreground#f5f5f5
textBlockQuote.background#303030
textBlockQuote.border#303030
textCodeBlock.background#303030
textLink.activeForeground#f5f5f5
textLink.foreground#fff59d
textPreformat.foreground#f5f5f5
textSeparator.foreground#9e9e9e
titleBar.activeBackground#111111
titleBar.activeForeground#9e9e9e
titleBar.border#121212
titleBar.inactiveBackground#111111
titleBar.inactiveForeground#616161
walkThrough.embeddedEditorBackground#1a1a1a
welcomePage.buttonBackground#303030
welcomePage.buttonHoverBackground#616161
widget.shadow#121212

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
meta.embedded	#f5f5f5	—
comment, comment keyword, comment markup.underline.link, comment string, comment punctuation.definition, comment punctuation, comment text	#9e9e9e	italic
comment storage.type	#9e9e9e	—
comment entity.name.type	#9e9e9e	—
comment variable, comment variable.other	#9e9e9e	—
comment keyword.codetag.notation	#ce93d8	—
comment.git-status.header.remote	#ef9a9a	—
comment.git-status.header.local	#81d4fa	—
comment.other.git-status.head	#f5f5f5	—
constant	#ce93d8	—
constant.other	#f5f5f5	—
constant.other.php	#ce93d8	—
constant.other.property	#ce93d8	—
constant.other.citation.latex	#ce93d8	—
constant.other.color	#ce93d8	—
constant.other.character-class.escape	#ce93d8	—
constant.other.key	#ce93d8	—
constant.other.symbol	#ffcc80	—
constant.numeric	#ce93d8	—
constant.language	#ce93d8	—
constant.character.escape	#ce93d8	—
constant.numeric.line-number.find-in-files	#616161	—
constant.numeric.line-number.match.find-in-files	#fff59d	—
entity.name.section	#fff59d	—
entity.name	#a5d6a7	—
entity.name.class	#81d4fa	—
entity.name.constant	#ce93d8	—
entity.name.namespace	#f5f5f5	—
entity.other.inherited-class	#81d4fa	italic
entity.name.function	#a5d6a7	—
entity.name.tag, entity.name.tag.js.jsx support.class.component.js.jsx, entity.name.tag support.class.component	#ef9a9a	—
entity.other.attribute-name	#81d4fa	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, entity.other.attribute-name.css	#a5d6a7	—
entity.other.attribute-name.id.css	#ffcc80	—
entity.other.attribute-name.pseudo-class.css, entity.other.pseudo-class.css, entity.other.pseudo-element.css	#81d4fa	italic
entity.name.function, support.function	#a5d6a7	—
entity.other.git-status.hex	#ce93d8	—
invalid	—	italic
keyword	#ef9a9a	—
keyword.control	#ef9a9a	—
keyword.operator	#ef9a9a	—
keyword.other.substitution	#9e9e9e	—
keyword.other.template.begin keyword.other.template.end	#ef9a9a	—
keyword.operator.heading.restructuredtext, keyword.operator.table.row.restructuredtext, keyword.operator.table.data.restructuredtext	#9e9e9e	—
markup.italic	—	italic
markup.bold	—	bold
markup.heading	#fff59d	—
markup.raw	#ffcc80	—
markup.underline	—	underline
markup.underline.link	#a5d6a7	—
markup.inserted, markup.inserted punctuation.definition.inserted	#a5d6a7	—
markup.deleted, markup.deleted punctuation.definition.deleted	#ef9a9a	—
markup.changed, markup.changed punctuation.definition.changed	#fff59d	—
markup.ignored, markup.ignored punctuation.definition.ignored	#9e9e9e	—
markup.untracked	#9e9e9e	—
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	#bdbdbd	—
meta.function-call, meta.function-call.arguments meta.function-call	#a5d6a7	—
meta.function-call meta.function-call.arguments, meta.function-call meta.arguments, meta.function-call meta.group	#f5f5f5	—
meta.instance.constructor	#a5d6a7	—
meta.attribute-with-value.class string	#a5d6a7	—
meta.attribute-with-value.id string	#ffcc80	—
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	#f5f5f5	—
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	#fff59d	—
meta.object.member	#f5f5f5	—
meta.property-list.css variable.other	#ffcc80	—
entity.name.constant.preprocessor, meta.preprocessor	#ce93d8	—
meta.diff.git-diff.header	#fff59d	—
punctuation	#bdbdbd	—
punctuation.definition.tag, punctuation.definition.tag source, punctuation.definition.group.begin.ruby, punctuation.definition.group.end.ruby punctuation.definition.group.begin.css, punctuation.definition.group.end.css	#9e9e9e	—
punctuation.definition.group	#f5f5f5	—
punctuation.definition.comment	#9e9e9e	—
punctuation.definition.variable, punctuation.definition.keyword.scss, punctuation.definition.entity.css	#9e9e9e	—
punctuation.section.embedded, punctuation.section.embedded entity.name.tag, punctuation.section.embedded constant.other, punctuation.section.embedded source	#ffcc80	—
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	#ef9a9a	—
meta.paragraph.markdown meta.dummy.line-break, meta.paragraph.markdown meta.hard-line-break.markdown	#ce93d8	—
region.redish	#ef9a9a	—
region.orangish	#ffcc80	—
region.yellowish	#fff59d	—
region.greenish	#a5d6a7	—
region.bluish	#81d4fa	—
region.purplish	#ce93d8	—
region.pinkish	#ef9a9a	—
region.whitish	#FFFFFF	—
source	#f5f5f5	—
source.scss, source.sass	#9e9e9e	—
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	#ffcc80	italic
source.git-show.commit.sha	#ce93d8	—
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	#9e9e9e	—
source.git-show meta.diff.git-diff.header.extended.index.from-sha, source.git-show meta.diff.git-diff.header.extended.index.to-sha	#ce93d8	—
source.git-show meta.diff.range.unified	#ffcc80	—
source.git-show meta.diff.header.from-file, source.git-show meta.diff.header.to-file	#9e9e9e	—
storage	#ef9a9a	—
storage.type	#81d4fa	italic
storage.type.extends	#ef9a9a
storage.type.function.arrow	#ef9a9a
storage.modifier	#ef9a9a	italic
storage.class.restructuredtext.ref	#ce93d8	—
string	#fff59d	—
string.unquoted.label	#f5f5f5	—
string source	#f5f5f5	—
string source punctuation.section.embedded	#9e9e9e	—
string.other.link.title, string.other.link.description	#ef9a9a	—
string.other.link.description.title	#81d4fa	—
string.regexp punctuation.definition.string.begin, string.regexp punctuation.definition.string.end	#ef9a9a	—
string.other.ref, string.other.restructuredtext.ref	#a5d6a7	—
string.other.git-status.help.key	#9e9e9e	—
string.other.git-status.remote	#ef9a9a	—
support.constant	#81d4fa	—
support.constant.handlebars	#9e9e9e	—
support.type.vendor-prefix.css	#9e9e9e	—
support.function	#a5d6a7	—
support.type, entity.name.type.object.console	#81d4fa	italic
support.variable	#81d4fa	—
support.type.property-name	#f5f5f5
support.class	#81d4fa	—
text	#f5f5f5	—
text.find-in-files	#f5f5f5	—
variable, variable.other	#f5f5f5	—
variable.parameter, parameters variable.function	#ffcc80	italic
variable.language, variable.parameter.function.language.special.self.python	#9e9e9e	italic
variable.language.arguments	#ce93d8	—
variable.other.class	#81d4fa	—
variable.other.constant	#ce93d8	—
variable.other.member	#f5f5f5	—
variable.function	#a5d6a7	—
variable.other.substitution	#ffcc80	—
source.ruby variable.other.readwrite.instance.ruby, source.ruby variable.other.readwrite.class.ruby	#ce93d8	—
token.info-token	#81d4fa	—
token.warn-token	#ffcc80	—
token.error-token	#ef9a9a	—
token.debug-token	#ce93d8	—

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}!`;
}