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 Subtle

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#fff9c4
activityBar.background#111111
activityBar.border#121212
activityBar.foreground#eeeeee
activityBar.inactiveForeground#9e9e9e
activityBarBadge.background#fff9c4
activityBarBadge.foreground#212121
badge.background#fff9c4
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#c8e6c919
diffEditor.insertedTextBorder#00000000
diffEditor.removedTextBackground#ffcdd219
diffEditor.removedTextBorder#00000000
dropdown.background#212121
dropdown.border#212121
dropdown.foreground#9e9e9e
dropdown.listBackground#303030
editor.background#212121
editor.findMatchBackground#f5f5f526
editor.findMatchBorder#fff9c4
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#ffcdd2
editorGroup.border#1a1a1a
editorGroup.dropBackground#1a1a1abf
editorGroup.emptyBackground#212121
editorGroup.focusedEmptyBorder#1a1a1a
editorGroupHeader.noTabsBackground#212121
editorGroupHeader.tabsBackground#1a1a1a
editorGroupHeader.tabsBorder#212121
editorGutter.addedBackground#c8e6c9
editorGutter.background#212121
editorGutter.deletedBackground#ffcdd2
editorGutter.modifiedBackground#ffe0b2
editorHint.border#212121
editorHint.foreground#e1bee7
editorHoverWidget.background#303030
editorHoverWidget.border#212121
editorIndentGuide.background#303030
editorInfo.border#212121
editorInfo.foreground#b3e5fc
editorLineNumber.activeForeground#9e9e9e
editorLineNumber.foreground#616161
editorLink.activeForeground#b3e5fc
editorMarkerNavigation.background#303030
editorMarkerNavigationError.background#ffcdd2
editorMarkerNavigationInfo.background#b3e5fc
editorMarkerNavigationWarning.background#ffe0b2
editorOverviewRuler.addedForeground#c8e6c9
editorOverviewRuler.border#212121
editorOverviewRuler.currentContentForeground#303030
editorOverviewRuler.deletedForeground#ffcdd2
editorOverviewRuler.errorForeground#ffcdd2
editorOverviewRuler.findMatchForeground#f5f5f526
editorOverviewRuler.incomingContentForeground#303030
editorOverviewRuler.infoForeground#b3e5fc
editorOverviewRuler.modifiedForeground#ffe0b2
editorOverviewRuler.rangeHighlightForeground#f5f5f526
editorOverviewRuler.selectionHighlightForeground#f5f5f526
editorOverviewRuler.warningForeground#ffe0b2
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#b2ebf2
editorWhitespace.foreground#616161
editorWidget.background#303030
editorWidget.border#303030
errorForeground#ffcdd2
extensionButton.prominentBackground#303030
extensionButton.prominentForeground#f5f5f5
extensionButton.prominentHoverBackground#616161
focusBorder#9e9e9e
foreground#f5f5f5
gitDecoration.conflictingResourceForeground#ffe0b2
gitDecoration.deletedResourceForeground#ffcdd2
gitDecoration.ignoredResourceForeground#616161
gitDecoration.modifiedResourceForeground#c8e6c9
gitDecoration.untrackedResourceForeground#ffe0b2
input.background#303030
input.border#303030
input.foreground#f5f5f5
input.placeholderForeground#9e9e9e
inputOption.activeBorder#616161
inputValidation.errorBackground#303030
inputValidation.errorBorder#ffcdd2
inputValidation.errorForeground#ffcdd2
inputValidation.infoBackground#303030
inputValidation.infoBorder#b3e5fc
inputValidation.infoForeground#b3e5fc
inputValidation.warningBackground#303030
inputValidation.warningBorder#ffe0b2
inputValidation.warningForeground#ffe0b2
list.activeSelectionBackground#212121
list.activeSelectionForeground#fff9c4
list.dropBackground#1a1a1abf
list.errorForeground#ffcdd2
list.focusBackground#212121
list.focusForeground#f5f5f5
list.highlightForeground#f5f5f5
list.hoverBackground#1a1a1a
list.hoverForeground#f5f5f5
list.inactiveFocusBackground#373737
list.inactiveSelectionBackground#212121
list.inactiveSelectionForeground#fff9c4
list.invalidItemForeground#ffcdd2
list.warningForeground#ffe0b2
listFilterWidget.background#373737
listFilterWidget.noMatchesOutline#ffcdd2
listFilterWidget.outline#00000000
merge.border#212121
merge.commonContentBackground#f5f5f519
merge.commonHeaderBackground#f5f5f526
merge.currentContentBackground#ffcdd219
merge.currentHeaderBackground#ffcdd226
merge.incomingContentBackground#c8e6c919
merge.incomingHeaderBackground#c8e6c926
notificationCenter.border#303030
notificationCenterHeader.background#303030
notificationCenterHeader.foreground#9e9e9e
notificationLink.foreground#fff9c4
notifications.background#303030
notifications.border#303030
notifications.foreground#9e9e9e
notificationToast.border#303030
panel.background#303030
panel.border#121212
panelInput.border#121212
panelTitle.activeBorder#fff9c4
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#fff9c4
settings.modifiedItemIndicator#fff9c4
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#fff9c4
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#fff9c4
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	#e1bee7	—
comment.git-status.header.remote	#ffcdd2	—
comment.git-status.header.local	#b3e5fc	—
comment.other.git-status.head	#f5f5f5	—
constant	#e1bee7	—
constant.other	#f5f5f5	—
constant.other.php	#e1bee7	—
constant.other.property	#e1bee7	—
constant.other.citation.latex	#e1bee7	—
constant.other.color	#e1bee7	—
constant.other.character-class.escape	#e1bee7	—
constant.other.key	#e1bee7	—
constant.other.symbol	#ffe0b2	—
constant.numeric	#e1bee7	—
constant.language	#e1bee7	—
constant.character.escape	#e1bee7	—
constant.numeric.line-number.find-in-files	#616161	—
constant.numeric.line-number.match.find-in-files	#fff9c4	—
entity.name.section	#fff9c4	—
entity.name	#c8e6c9	—
entity.name.class	#b3e5fc	—
entity.name.constant	#e1bee7	—
entity.name.namespace	#f5f5f5	—
entity.other.inherited-class	#b3e5fc	italic
entity.name.function	#c8e6c9	—
entity.name.tag, entity.name.tag.js.jsx support.class.component.js.jsx, entity.name.tag support.class.component	#ffcdd2	—
entity.other.attribute-name	#b3e5fc	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	#c8e6c9	—
entity.other.attribute-name.id.css	#ffe0b2	—
entity.other.attribute-name.pseudo-class.css, entity.other.pseudo-class.css, entity.other.pseudo-element.css	#b3e5fc	italic
entity.name.function, support.function	#c8e6c9	—
entity.other.git-status.hex	#e1bee7	—
invalid	—	italic
keyword	#ffcdd2	—
keyword.control	#ffcdd2	—
keyword.operator	#ffcdd2	—
keyword.other.substitution	#9e9e9e	—
keyword.other.template.begin keyword.other.template.end	#ffcdd2	—
keyword.operator.heading.restructuredtext, keyword.operator.table.row.restructuredtext, keyword.operator.table.data.restructuredtext	#9e9e9e	—
markup.italic	—	italic
markup.bold	—	bold
markup.heading	#fff9c4	—
markup.raw	#ffe0b2	—
markup.underline	—	underline
markup.underline.link	#c8e6c9	—
markup.inserted, markup.inserted punctuation.definition.inserted	#c8e6c9	—
markup.deleted, markup.deleted punctuation.definition.deleted	#ffcdd2	—
markup.changed, markup.changed punctuation.definition.changed	#fff9c4	—
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	#c8e6c9	—
meta.function-call meta.function-call.arguments, meta.function-call meta.arguments, meta.function-call meta.group	#f5f5f5	—
meta.instance.constructor	#c8e6c9	—
meta.attribute-with-value.class string	#c8e6c9	—
meta.attribute-with-value.id string	#ffe0b2	—
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	#fff9c4	—
meta.object.member	#f5f5f5	—
meta.property-list.css variable.other	#ffe0b2	—
entity.name.constant.preprocessor, meta.preprocessor	#e1bee7	—
meta.diff.git-diff.header	#fff9c4	—
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	#ffe0b2	—
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	#ffcdd2	—
meta.paragraph.markdown meta.dummy.line-break, meta.paragraph.markdown meta.hard-line-break.markdown	#e1bee7	—
region.redish	#ffcdd2	—
region.orangish	#ffe0b2	—
region.yellowish	#fff9c4	—
region.greenish	#c8e6c9	—
region.bluish	#b3e5fc	—
region.purplish	#e1bee7	—
region.pinkish	#ffcdd2	—
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	#ffe0b2	italic
source.git-show.commit.sha	#e1bee7	—
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	#e1bee7	—
source.git-show meta.diff.range.unified	#ffe0b2	—
source.git-show meta.diff.header.from-file, source.git-show meta.diff.header.to-file	#9e9e9e	—
storage	#ffcdd2	—
storage.type	#b3e5fc	italic
storage.type.extends	#ffcdd2
storage.type.function.arrow	#ffcdd2
storage.modifier	#ffcdd2	italic
storage.class.restructuredtext.ref	#e1bee7	—
string	#fff9c4	—
string.unquoted.label	#f5f5f5	—
string source	#f5f5f5	—
string source punctuation.section.embedded	#9e9e9e	—
string.other.link.title, string.other.link.description	#ffcdd2	—
string.other.link.description.title	#b3e5fc	—
string.regexp punctuation.definition.string.begin, string.regexp punctuation.definition.string.end	#ffcdd2	—
string.other.ref, string.other.restructuredtext.ref	#c8e6c9	—
string.other.git-status.help.key	#9e9e9e	—
string.other.git-status.remote	#ffcdd2	—
support.constant	#b3e5fc	—
support.constant.handlebars	#9e9e9e	—
support.type.vendor-prefix.css	#9e9e9e	—
support.function	#c8e6c9	—
support.type, entity.name.type.object.console	#b3e5fc	italic
support.variable	#b3e5fc	—
support.type.property-name	#f5f5f5
support.class	#b3e5fc	—
text	#f5f5f5	—
text.find-in-files	#f5f5f5	—
variable, variable.other	#f5f5f5	—
variable.parameter, parameters variable.function	#ffe0b2	italic
variable.language, variable.parameter.function.language.special.self.python	#9e9e9e	italic
variable.language.arguments	#e1bee7	—
variable.other.class	#b3e5fc	—
variable.other.constant	#e1bee7	—
variable.other.member	#f5f5f5	—
variable.function	#c8e6c9	—
variable.other.substitution	#ffe0b2	—
source.ruby variable.other.readwrite.instance.ruby, source.ruby variable.other.readwrite.class.ruby	#e1bee7	—
token.info-token	#b3e5fc	—
token.warn-token	#ffe0b2	—
token.error-token	#ffcdd2	—
token.debug-token	#e1bee7	—

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