Woodsmoke

Name: Woodsmoke
Author: Quentin Lowette

Publisher: Quentin LowetteThemes in package: 1

A dark blue VS Code theme.

GitHub

VS Code preview

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

Woodsmoke — Woodsmoke

fetchUser.ts

index.ts

README.md

main*

Copilot

Ln 5, Col 12

Spaces: 2

UTF-8

TypeScript

Dark+

colors

Workbench UI color keys from the theme JSON colors map.

activityBar.activeBackground#2d3033
activityBar.activeBorder#3A6EA5
activityBar.activeFocusBorder#3A6EA5
activityBar.background#2d3033
activityBar.border#2d3033
activityBar.dropBorder#3A6EA5
activityBar.foreground#f6f8fa
activityBar.inactiveForeground#949596
activityBarBadge.background#3A6EA5
activityBarBadge.foreground#f6f8fa
badge.background#5c5e60
badge.foreground#f6f8fa
banner.background#234263
banner.foreground#f6f8fa
banner.iconForeground#f6f8fa
breadcrumb.activeSelectionForeground#f6f8fa
breadcrumb.background#16191c
breadcrumb.focusForeground#f6f8fa
breadcrumb.foreground#949596
breadcrumbPicker.background#16191c
button.background#234263
button.foreground#f6f8fa
button.hoverBackground#2e5884
button.secondaryBackground#454749
button.secondaryForeground#f6f8fa
button.secondaryHoverBackground#5c5e60
charts.blue#ff0000
charts.foreground#ff0000
charts.green#ff0000
charts.lines#ff0000
charts.orange#ff0000
charts.purple#ff0000
charts.red#ff0000
charts.yellow#ff0000
checkbox.background#454749
checkbox.border#454749
checkbox.foreground#f6f8fa
dart.closingLabels#949596
dart.flutterUiGuides#ff0000
debugConsole.errorForeground#f95c63
debugConsole.infoForeground#618bb7
debugConsole.sourceForeground#ff0000
debugConsole.warningForeground#f3a738
debugConsoleInputIcon.foreground#949596
debugExceptionWidget.background#4a0f12
debugExceptionWidget.border#F8333C
debugIcon.breakpointCurrentStackframeForeground#f3a738
debugIcon.breakpointDisabledForeground#454749
debugIcon.breakpointForeground#f95c63
debugIcon.breakpointStackframeForeground#549735
debugIcon.breakpointUnverifiedForeground#949596
debugIcon.continueForeground#618bb7
debugIcon.disconnectForeground#f95c63
debugIcon.pauseForeground#618bb7
debugIcon.restartForeground#549735
debugIcon.startForeground#549735
debugIcon.stepBackForeground#618bb7
debugIcon.stepIntoForeground#618bb7
debugIcon.stepOutForeground#618bb7
debugIcon.stepOverForeground#618bb7
debugIcon.stopForeground#f95c63
debugTokenExpression.boolean#618bb7
debugTokenExpression.error#f95c63
debugTokenExpression.name#c586c0
debugTokenExpression.number#76ac5d
debugTokenExpression.string#ce9178
debugTokenExpression.value#acaeaf
debugToolBar.background#222527
debugToolBar.border#222527
debugView.exceptionLabelBackground#c62930
debugView.exceptionLabelForeground#f6f8fa
debugView.stateLabelBackground#5c5e60
debugView.stateLabelForeground#f6f8fa
debugView.valueChangedHighlight#3a6ea5
descriptionForeground#949596
diffEditor.border#5c5e60
diffEditor.diagonalFill#454749
diffEditor.insertedTextBackground#54973540
diffEditor.removedTextBackground#F8333C40
dropdown.background#393c3e
dropdown.border#393c3e
dropdown.foreground#f6f8fa
dropdown.listBackground#393c3e
editor.background#16191c
editor.findMatchBackground#234263
editor.findMatchBorder#234263
editor.findMatchHighlightBackground#614316
editor.findMatchHighlightBorder#614316
editor.findRangeHighlightBackground#2d30337f
editor.focusedStackFrameHighlightBackground#2a4c1b
editor.foldBackground#45474940
editor.foreground#f6f8fa
editor.hoverHighlightBackground#2342637f
editor.inactiveSelectionBackground#4547497f
editor.inlineValuesBackground#ff0000
editor.inlineValuesForeground#ff0000
editor.lineHighlightBackground#222527
editor.lineHighlightBorder#2d3033
editor.linkedEditingBackground#ff0000
editor.rangeHighlightBackground#4547497f
editor.selectionBackground#234263
editor.selectionForeground#f6f8fa
editor.selectionHighlightBackground#4547497f
editor.snippetFinalTabstopHighlightBackground#ff0000
editor.snippetFinalTabstopHighlightBorder#618bb7
editor.snippetTabstopHighlightBackground#2d3033
editor.stackFrameHighlightBackground#614316
editor.symbolHighlightBackground#3a6ea57f
editor.wordHighlightBackground#5c5e607f
editor.wordHighlightStrongBackground#3a6ea57f
editorBracketMatch.background#454749
editorBracketMatch.border#949596
editorCodeLens.foreground#949596
editorCursor.background#f6f8fa
editorCursor.foreground#f6f8fa
editorError.foreground#F8333C
editorGhostText.foreground#7b7c7d
editorGroup.border#5c5e60
editorGroup.dropBackground#4547497f
editorGroup.emptyBackground#16191c
editorGroupHeader.noTabsBackground#16191c
editorGroupHeader.tabsBackground#222527
editorGutter.addedBackground#549735
editorGutter.background#16191c
editorGutter.commentRangeForeground#ff0000
editorGutter.deletedBackground#F8333C
editorGutter.foldingControlForeground#949596
editorGutter.modifiedBackground#3a6ea5
editorHint.border#949596
editorHint.foreground#94959600
editorHoverWidget.background#16191c
editorHoverWidget.border#5c5e60
editorHoverWidget.foreground#f6f8fa
editorHoverWidget.highlightForeground#3a6ea5
editorHoverWidget.statusBarBackground#222527
editorIndentGuide.activeBackground#626364
editorIndentGuide.background#454749
editorInfo.foreground#3a6ea5
editorInlayHint.background#ff0000
editorInlayHint.foreground#ff0000
editorInlayHint.parameterBackground#ff0000
editorInlayHint.parameterForeground#ff0000
editorInlayHint.typeBackground#ff0000
editorInlayHint.typeForeground#ff0000
editorLightBulb.foreground#f3a738
editorLightBulbAutoFix.foreground#ff0000
editorLineNumber.activeForeground#949596
editorLineNumber.foreground#626364
editorLink.activeForeground#3a6ea5
editorMarkerNavigation.background#222527
editorMarkerNavigationError.background#F8333C
editorMarkerNavigationError.headerBackground#F8333C40
editorMarkerNavigationInfo.background#3a6ea5
editorMarkerNavigationInfo.headerBackground#3a6ea540
editorMarkerNavigationWarning.background#f3a738
editorMarkerNavigationWarning.headerBackground#f3a73840
editorOverviewRuler.addedForeground#549735
editorOverviewRuler.background#16191c
editorOverviewRuler.border#5c5e60
editorOverviewRuler.bracketMatchForeground#949596
editorOverviewRuler.commonContentForeground#5c5e60
editorOverviewRuler.currentContentForeground#614316
editorOverviewRuler.deletedForeground#F8333C
editorOverviewRuler.errorForeground#F8333C
editorOverviewRuler.findMatchForeground#c2862d7f
editorOverviewRuler.incomingContentForeground#234263
editorOverviewRuler.infoForeground#3a6ea5
editorOverviewRuler.modifiedForeground#3a6ea5
editorOverviewRuler.rangeHighlightForeground#ff0000
editorOverviewRuler.selectionHighlightForeground#949596
editorOverviewRuler.warningForeground#f3a738
editorOverviewRuler.wordHighlightForeground#234263
editorOverviewRuler.wordHighlightStrongForeground#234263
editorPane.background#16191c
editorRuler.foreground#454749
editorSuggestWidget.background#222527
editorSuggestWidget.border#454749
editorSuggestWidget.focusHighlightForeground#618bb7
editorSuggestWidget.foreground#f6f8fa
editorSuggestWidget.highlightForeground#618bb7
editorSuggestWidget.selectedBackground#234263
editorSuggestWidget.selectedForeground#f6f8fa
editorUnnecessaryCode.opacity#0000007f
editorWarning.foreground#f3a738
editorWhitespace.foreground#5c5e60
editorWidget.background#222527
editorWidget.border#222527
editorWidget.foreground#f6f8fa
editorWidget.resizeBorder#3a6ea5
errorForeground#F8333C
extensionBadge.remoteBackground#234263
extensionBadge.remoteForeground#f6f8fa
extensionButton.prominentBackground#234263
extensionButton.prominentForeground#f6f8fa
extensionButton.prominentHoverBackground#2e5884
extensionIcon.starForeground#f3a738
extensionIcon.verifiedForeground#618bb7
focusBorder#3a6ea5
foreground#c5c6c8
gitDecoration.addedResourceForeground#549735
gitDecoration.conflictingResourceForeground#BF5FB4
gitDecoration.deletedResourceForeground#F8333C
gitDecoration.ignoredResourceForeground#7b7c7d
gitDecoration.modifiedResourceForeground#3a6ea5
gitDecoration.renamedResourceForeground#3a6ea5
gitDecoration.stageDeletedResourceForeground#F8333C
gitDecoration.stageModifiedResourceForeground#3a6ea5
gitDecoration.submoduleResourceForeground#ff0000
gitDecoration.untrackedResourceForeground#09BC8A
icon.foreground#f6f8fa
input.background#393c3e
input.border#393c3e
input.foreground#c5c6c8
input.placeholderForeground#949596
inputOption.activeBackground#2e5884
inputOption.activeBorder#2e5884
inputOption.activeForeground#f6f8fa
inputValidation.errorBackground#4a0f12
inputValidation.errorBorder#F8333C
inputValidation.errorForeground#f6f8fa
inputValidation.infoBackground#172c42
inputValidation.infoBorder#3a6ea5
inputValidation.infoForeground#f6f8fa
inputValidation.warningBackground#614316
inputValidation.warningBorder#f3a738
inputValidation.warningForeground#f6f8fa
interactive.activeCodeBorder#3a6ea5
interactive.inactiveCodeBorder#454749
keybindingLabel.background#454749
keybindingLabel.border#454749
keybindingLabel.bottomBorder#454749
keybindingLabel.foreground#f6f8fa
keybindingTable.headerBackground#2d3033
keybindingTable.rowsBackground#222527
list.activeSelectionBackground#234263
list.activeSelectionForeground#f6f8fa
list.deemphasizedForeground#7b7c7d
list.dropBackground#4547497f
list.errorForeground#f95c63
list.filterMatchBackground#614316
list.filterMatchBorder#614316
list.focusForeground#f6f8fa
list.focusHighlightForeground#3a6ea5
list.focusOutline#3a6ea5
list.highlightForeground#3a6ea5
list.hoverBackground#2d3033
list.hoverForeground#f6f8fa
list.inactiveSelectionBackground#393c3e
list.inactiveSelectionForeground#f6f8fa
list.invalidItemForeground#F8333C
list.warningForeground#f3a738
listFilterWidget.background#234263
listFilterWidget.noMatchesOutline#F8333C
listFilterWidget.outline#2e5884
menu.background#222527
menu.border#222527
menu.foreground#f6f8fa
menu.selectionBackground#234263
menu.selectionBorder#234263
menu.selectionForeground#f6f8fa
menu.separatorBackground#acaeaf
menubar.selectionBackground#222527
menubar.selectionBorder#222527
menubar.selectionForeground#f6f8fa
merge.border#5c5e60
merge.commonContentBackground#5c5e6040
merge.commonHeaderBackground#5c5e607f
merge.currentContentBackground#f3a73840
merge.currentHeaderBackground#f3a7387f
merge.incomingContentBackground#3a6ea540
merge.incomingHeaderBackground#3a6ea57f
minimap.background#16191c
minimap.errorHighlight#F8333C
minimap.findMatchHighlight#614316
minimap.selectionHighlight#2e5884
minimap.selectionOccurrenceHighlight#454749
minimap.warningHighlight#f3a738
minimapGutter.addedBackground#549735
minimapGutter.deletedBackground#F8333C
minimapGutter.modifiedBackground#3a6ea5
minimapSlider.activeBackground#454749a0
minimapSlider.background#45474950
minimapSlider.hoverBackground#45474980
notebook.cellBorderColor#454749
notebook.cellEditorBackground#222527
notebook.cellHoverBackground#16191c
notebook.cellInsertionIndicator#3a6ea5
notebook.cellStatusBarItemHoverBackground#5c5e60
notebook.cellToolbarSeparator#5c5e60
notebook.focusedCellBackground#16191c
notebook.focusedCellBorder#3a6ea5
notebook.focusedEditorBorder#3a6ea5
notebook.inactiveFocusedCellBorder#5c5e60
notebook.outputContainerBackgroundColor#16191c
notebook.selectedCellBackground#234263
notebook.selectedCellBorder#ff0000
notebook.symbolHighlightBackground#ff0000
notebookScrollbarSlider.activeBackground#454749a0
notebookScrollbarSlider.background#45474950
notebookScrollbarSlider.hoverBackground#45474980
notebookStatusErrorIcon.foreground#F8333C
notebookStatusRunningIcon.foreground#3a6ea5
notebookStatusSuccessIcon.foreground#549735
notificationCenter.border#2d3033
notificationCenterHeader.background#2d3033
notificationCenterHeader.foreground#f6f8fa
notificationLink.foreground#3a6ea5
notifications.background#222527
notifications.border#222527
notifications.foreground#f6f8fa
notificationsErrorIcon.foreground#F8333C
notificationsInfoIcon.foreground#3a6ea5
notificationsWarningIcon.foreground#f3a738
notificationToast.border#ff0000
panel.background#16191c
panel.border#5c5e60
panel.dropBorder#3a6ea5
panelInput.border#ff0000
panelSection.border#5c5e60
panelSection.dropBackground#4547497f
panelSectionHeader.background#2d3033
panelSectionHeader.border#ff0000
panelSectionHeader.foreground#f6f8fa
panelTitle.activeBorder#3a6ea5
panelTitle.activeForeground#f6f8fa
panelTitle.inactiveForeground#949596
peekView.border#3a6ea5
peekViewEditor.background#0d0f11
peekViewEditor.matchHighlightBackground#614316
peekViewEditor.matchHighlightBorder#614316
peekViewEditorGutter.background#0d0f11
peekViewResult.background#16191c
peekViewResult.fileForeground#f6f8fa
peekViewResult.lineForeground#949596
peekViewResult.matchHighlightBackground#614316
peekViewResult.selectionBackground#234263
peekViewResult.selectionForeground#f6f8fa
peekViewTitle.background#3a6ea540
peekViewTitleDescription.foreground#acaeaf
peekViewTitleLabel.foreground#f6f8fa
pickerGroup.border#5c5e60
pickerGroup.foreground#3a6ea5
ports.iconRunningProcessForeground#ff0000
problemsErrorIcon.foreground#F8333C
problemsInfoIcon.foreground#3a6ea5
problemsWarningIcon.foreground#f3a738
progressBar.background#3a6ea5
quickInput.background#222527
quickInput.foreground#f6f8fa
quickInputList.focusBackground#234263
quickInputList.focusForeground#f6f8fa
quickInputTitle.background#ff0000
sash.hoverBorder#5c5e60
scm.providerBorder#ff0000
scrollbar.shadow#090a0b
scrollbarSlider.activeBackground#454749a0
scrollbarSlider.background#45474950
scrollbarSlider.hoverBackground#45474980
searchEditor.findMatchBackground#614316
searchEditor.findMatchBorder#614316
searchEditor.textInputBorder#3a6ea5
selection.background#2e5884
settings.checkboxBackground#454749
settings.checkboxBorder#454749
settings.checkboxForeground#c5c6c8
settings.dropdownBackground#393c3e
settings.dropdownBorder#5c5e60
settings.dropdownForeground#c5c6c8
settings.dropdownListBorder#acaeaf
settings.focusedRowBackground#2d3033
settings.focusedRowBorder#393c3e
settings.headerForeground#f6f8fa
settings.modifiedItemIndicator#3a6ea5
settings.numberInputBackground#393c3e
settings.numberInputBorder#5c5e60
settings.numberInputForeground#c5c6c8
settings.rowHoverBackground#222527
settings.textInputBackground#393c3e
settings.textInputBorder#5c5e60
settings.textInputForeground#c5c6c8
sideBar.background#222527
sideBar.border#222527
sideBar.dropBackground#4547497f
sideBar.foreground#c5c6c8
sideBarSectionHeader.background#2d3033
sideBarSectionHeader.border#2d3033
sideBarSectionHeader.foreground#f6f8fa
sideBarTitle.foreground#f6f8fa
sideBySideEditor.horizontalBorder#ff0000
sideBySideEditor.verticalBorder#ff0000
statusBar.background#234263
statusBar.debuggingBackground#614316
statusBar.debuggingForeground#f6f8fa
statusBar.foreground#f6f8fa
statusBar.noFolderBackground#2d3033
statusBar.noFolderForeground#f6f8fa
statusBarItem.activeBackground#ffffff50
statusBarItem.errorBackground#F8333C
statusBarItem.errorForeground#f6f8fa
statusBarItem.hoverBackground#ffffff30
statusBarItem.prominentBackground#ffffff50
statusBarItem.prominentForeground#f6f8fa
statusBarItem.prominentHoverBackground#ffffff70
statusBarItem.remoteBackground#0d0f11
statusBarItem.remoteForeground#f6f8fa
statusBarItem.warningBackground#f3a738
statusBarItem.warningForeground#f6f8fa
symbolIcon.arrayForeground#f6f8fa
symbolIcon.booleanForeground#f6f8fa
symbolIcon.classForeground#09BC8A
symbolIcon.colorForeground#f6f8fa
symbolIcon.constantForeground#f6f8fa
symbolIcon.constructorForeground#BF5FB4
symbolIcon.enumeratorForeground#f5b960
symbolIcon.enumeratorMemberForeground#ff0000
symbolIcon.eventForeground#ff0000
symbolIcon.fieldForeground#3a6ea5
symbolIcon.fileForeground#f6f8fa
symbolIcon.folderForeground#ff0000
symbolIcon.functionForeground#f5b960
symbolIcon.interfaceForeground#ff0000
symbolIcon.keyForeground#ff0000
symbolIcon.keywordForeground#BF5FB4
symbolIcon.methodForeground#f5b960
symbolIcon.moduleForeground#f6f8fa
symbolIcon.namespaceForeground#ff0000
symbolIcon.nullForeground#ff0000
symbolIcon.numberForeground#f6f8fa
symbolIcon.objectForeground#ff0000
symbolIcon.operatorForeground#ff0000
symbolIcon.packageForeground#ff0000
symbolIcon.propertyForeground#f6f8fa
symbolIcon.referenceForeground#ff0000
symbolIcon.snippetForeground#f6f8fa
symbolIcon.stringForeground#f6f8fa
symbolIcon.structForeground#ff0000
symbolIcon.textForeground#f6f8fa
symbolIcon.typeParameterForeground#ff0000
symbolIcon.unitForeground#f6f8fa
symbolIcon.variableForeground#3a6ea5
tab.activeBackground#16191c
tab.activeBorder#16191c
tab.activeBorderTop#16191c
tab.activeForeground#f6f8fa
tab.activeModifiedBorder#ff0000
tab.border#16191c
tab.hoverBackground#2d3033
tab.hoverBorder#2d3033
tab.hoverForeground#f6f8fa
tab.inactiveBackground#222527
tab.inactiveForeground#acaeaf
tab.inactiveModifiedBorder#ff0000
tab.lastPinnedBorder#ff0000
tab.unfocusedActiveBackground#16191c
tab.unfocusedActiveBorder#16191c
tab.unfocusedActiveBorderTop#16191c
tab.unfocusedActiveForeground#acaeaf
tab.unfocusedActiveModifiedBorder#ff0000
tab.unfocusedHoverBackground#2d3033
tab.unfocusedHoverBorder#2d3033
tab.unfocusedHoverForeground#f6f8fa
tab.unfocusedInactiveBackground#222527
tab.unfocusedInactiveForeground#acaeaf
tab.unfocusedInactiveModifiedBorder#ff0000
terminal.ansiBlack#212121
terminal.ansiBlue#82AAFF
terminal.ansiBrightBlack#4A4A4A
terminal.ansiBrightBlue#82AAFF
terminal.ansiBrightCyan#89DDFF
terminal.ansiBrightGreen#C3E88D
terminal.ansiBrightMagenta#C792EA
terminal.ansiBrightRed#F07178
terminal.ansiBrightWhite#FFFFFF
terminal.ansiBrightYellow#FFCB6B
terminal.ansiCyan#89DDFF
terminal.ansiGreen#C3E88D
terminal.ansiMagenta#C792EA
terminal.ansiRed#F07178
terminal.ansiWhite#EEFFFF
terminal.ansiYellow#FFCB6B
terminal.background#16191c
terminal.border#949596
terminal.dropBackground#3a3e437f
terminal.foreground#f6f8fa
terminal.selectionBackground#234263
terminal.tab.activeBorder#3a6ea5
terminalCursor.background#f6f8fa
terminalCursor.foreground#3a6ea5
testing.iconErrored#F8333C
testing.iconFailed#F8333C
testing.iconPassed#549735
testing.iconQueued#ff0000
testing.iconSkipped#ff0000
testing.iconUnset#949596
testing.message.error.decorationForeground#ff0000
testing.message.error.lineBackground#ff0000
testing.message.info.decorationForeground#ff0000
testing.message.info.lineBackground#ff0000
testing.peekBorder#ff0000
testing.peekHeaderBackground#ff0000
testing.runAction#ff0000
textBlockQuote.background#2d3033
textBlockQuote.border#3a6ea5
textCodeBlock.background#ff0000
textLink.activeForeground#618bb7
textLink.foreground#3a6ea5
textPreformat.foreground#f5b960
textSeparator.foreground#ff0000
titleBar.activeBackground#0d0f11
titleBar.activeForeground#f6f8fa
titleBar.inactiveBackground#16191c
titleBar.inactiveForeground#949596
toolbar.activeBackground#ffffff50
toolbar.hoverBackground#ffffff30
tree.indentGuidesStroke#5c5e60
tree.tableColumnsBorder#5c5e60
walkThrough.embeddedEditorBackground#0d0f11
welcomePage.background#16191c
welcomePage.progress.background#454749
welcomePage.progress.foreground#3a6ea5
welcomePage.tileBackground#2d3033
welcomePage.tileHoverBackground#393c3e
welcomePage.tileShadow#ff0000
widget.shadow#090a0b

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
meta.embedded, source.groovy.embedded	#f6f8fa	—
emphasis	—	italic
strong	—	bold
header	#0000ff	—
comment	#6A9955	italic
constant.language	#5893d4	—
constant.numeric, variable.other.enummember, keyword.operator.plus.exponent, keyword.operator.minus.exponent	#c1d7ae	—
constant.regexp	#ff0000	—
entity.name.tag	#5893d4	—
entity.name.tag.css	#d4a964	—
entity.other.attribute-name	#b8dbff	—
entity.other.attribute-name.class.css, entity.other.attribute-name.class.mixin.css, entity.other.attribute-name.id.css, entity.other.attribute-name.parent-selector.css, entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.pseudo-element.css, source.css.less entity.other.attribute-name.id, entity.other.attribute-name.scss	#d4a964	—
invalid	#d24b4f	—
markup.underline	—	underline
markup.bold	#5893d4	bold
markup.heading	#5893d4	bold
markup.italic	—	italic
markup.inserted	#c586c0	—
markup.deleted	#ff0000	—
markup.changed	#ff0000	—
punctuation.definition.quote.begin.markdown	#c586c0	—
punctuation.definition.list.begin.markdown	#c586c0	—
markup.inline.raw	#d4a964	—
punctuation.definition.tag	#949596	—
meta.preprocessor, entity.name.function.preprocessor	#5893d4	—
meta.preprocessor.string	#ce9178	—
meta.preprocessor.numeric	#c1d7ae	—
meta.structure.dictionary.key.python	#ff0000	—
meta.diff.header	#5893d4	—
storage	#5893d4	—
storage.type	#5893d4	—
storage.modifier, keyword.operator.noexcept	#5893d4	—
string, meta.embedded.assembly	#ce9178	—
string.tag	#ce9178	—
string.value	#ce9178	—
string.regexp	#c586c0	—
punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.section.embedded	#5893d4	—
meta.template.expression	#f6f8fa	—
support.type.vendored.property-name, support.type.property-name, variable.css, variable.scss, variable.other.less, source.coffee.embedded	#b8dbff	—
keyword	#5893d4	—
keyword.control	#5893d4	—
keyword.operator	#f6f8fa	—
keyword.operator.new, keyword.operator.expression, keyword.operator.cast, keyword.operator.sizeof, keyword.operator.alignof, keyword.operator.typeid, keyword.operator.alignas, keyword.operator.instanceof, keyword.operator.logical.python, keyword.operator.wordlike	#5893d4	—
keyword.other.unit	#c586c0	—
punctuation.section.embedded.begin.php, punctuation.section.embedded.end.php	#5893d4	—
support.function.git-rebase	#b8dbff	—
constant.sha.git-rebase	#00ff00	—
storage.modifier.import.java, variable.language.wildcard.java, storage.modifier.package.java	#f6f8fa	—
variable.language	#5893d4	—
entity.name.function, support.function, support.constant.handlebars, source.powershell variable.other.member, entity.name.operator.custom-literal	#daca84	—
meta.return-type, support.class, support.type, entity.name.type, entity.name.namespace, entity.other.attribute, entity.name.scope-resolution, entity.name.class, storage.type.numeric.go, storage.type.byte.go, storage.type.boolean.go, storage.type.string.go, storage.type.uintptr.go, storage.type.error.go, storage.type.rune.go, storage.type.cs, storage.type.generic.cs, storage.type.modifier.cs, storage.type.variable.cs, storage.type.annotation.java, storage.type.generic.java, storage.type.java, storage.type.object.array.java, storage.type.primitive.array.java, storage.type.primitive.java, storage.type.token.java, storage.type.groovy, storage.type.annotation.groovy, storage.type.parameters.groovy, storage.type.generic.groovy, storage.type.object.array.groovy, storage.type.primitive.array.groovy, storage.type.primitive.groovy	#00b890	—
meta.type.cast.expr, meta.type.new.expr, support.constant.math, support.constant.dom, support.constant.json, entity.other.inherited-class	#00b890	—
keyword.control, source.cpp keyword.operator.new, keyword.operator.delete, keyword.other.using, keyword.other.operator, entity.name.operator	#c586c0	—
variable, meta.definition.variable.name, support.variable, entity.name.variable	#b8dbff	—
variable.other.constant, variable.other.enummember	#b8dbff	—
meta.object-literal.key	#b8dbff	—
support.constant.property-value, support.constant.font-name, support.constant.media-type, support.constant.media, constant.other.color.rgb-value, constant.other.rgb-value, support.constant.color	#ce9178	—
punctuation.definition.group.regexp, punctuation.definition.group.assertion.regexp, punctuation.definition.character-class.regexp, punctuation.character.set.begin.regexp, punctuation.character.set.end.regexp, keyword.operator.negation.regexp, support.other.parenthesis.regexp	#c586c0	—
constant.character.character-class.regexp, constant.other.character-class.set.regexp, constant.other.character-class.regexp, constant.character.set.regexp	#c586c0	—
keyword.operator.or.regexp, keyword.control.anchor.regexp	#c1d7ae	—
keyword.operator.quantifier.regexp	#d4a964	—
constant.character	#5893d4	—
constant.character.escape	#d4a964	—
entity.name.label	#ff0000	—
log.error	#d24b4f	—
log.warning	#eec340	—
log.info	#5893d4	—
log.debug	#f6f8fa	—

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