mono

Name: mono
Author: Stepan Vanzuriak

Publisher: Stepan VanzuriakThemes in package: 2

Monochrome dark and white theme

GitHub

Color themes

VS Code preview

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

mono — mono white

fetchUser.ts

index.ts

README.md

main*

Copilot

Ln 5, Col 12

Spaces: 2

UTF-8

TypeScript

Light+

colors

Workbench UI color keys from the theme JSON colors map.

actionBar.toggledBackground#0f0f0f33
activityBar.activeBackground#0f0f0f88
activityBar.activeBorder#0f0f0f88
activityBar.activeFocusBorder#0f0f0f88
activityBar.background#f0f0f0
activityBar.border#0f0f0f88
activityBar.dropBorder#0f0f0f33
activityBar.foreground#0f0f0f
activityBar.inactiveForeground#0f0f0f88
activityBarBadge.background#0f0f0f
activityBarBadge.foreground#f0f0f0
activityBarTop.activeBackground#0f0f0f33
activityBarTop.activeBorder#0f0f0f
activityBarTop.background#f0f0f0
activityBarTop.dropBorder#0f0f0f33
activityBarTop.foreground#0f0f0f
activityBarTop.inactiveForeground#0f0f0f88
activityErrorBadge.background#b10207
activityErrorBadge.foreground#f0f0f0
activityWarningBadge.background#fe982a
activityWarningBadge.foreground#f0f0f0
badge.background#f0f0f0
badge.foreground#0f0f0f
banner.background#c3c3c3
banner.foreground#0f0f0f
banner.iconForeground#0f0f0f
breadcrumb.activeSelectionForeground#0f0f0f
breadcrumb.background#f0f0f0
breadcrumb.focusForeground#0f0f0f
breadcrumb.foreground#0f0f0f88
breadcrumbPicker.background#f0f0f0
button.background#f0f0f0
button.border#0f0f0f88
button.foreground#0f0f0f
button.hoverBackground#0f0f0f88
button.secondaryBackground#c3c3c3
button.secondaryForeground#0f0f0f
button.secondaryHoverBackground#0f0f0f33
button.separator#0f0f0f88
charts.blue#0f0f0f
charts.foreground#0f0f0f
charts.green#0f0f0f
charts.lines#0f0f0f88
charts.orange#0f0f0f
charts.purple#0f0f0f
charts.red#b10207
charts.yellow#fe982a
chat.avatarBackground#c3c3c3
chat.avatarForeground#0f0f0f
chat.editedFileForeground#0f0f0f88
chat.requestBackground#f0f0f0
chat.requestBorder#0f0f0f33
chat.slashCommandBackground#c3c3c3
chat.slashCommandForeground#0f0f0f
checkbox.background#f0f0f0
checkbox.border#0f0f0f88
checkbox.foreground#0f0f0f
checkbox.selectBackground#f0f0f0
checkbox.selectBorder#0f0f0f
commandCenter.activeBackground#c3c3c3
commandCenter.activeBorder#0f0f0f88
commandCenter.activeForeground#0f0f0f
commandCenter.background#f0f0f0
commandCenter.border#0f0f0f88
commandCenter.inactiveBorder#0f0f0f33
commandCenter.inactiveForeground#0f0f0f88
commentsView.resolvedIcon#0f0f0f88
commentsView.unresolvedIcon#0f0f0f
contrastActiveBorder#0f0f0f88
contrastBorder#0f0f0f33
debugConsole.errorForeground#b10207
debugConsole.infoForeground#0f0f0f
debugConsole.sourceForeground#0f0f0f88
debugConsole.warningForeground#fe982a
debugConsoleInputIcon.foreground#0f0f0f
debugExceptionWidget.background#f0f0f0
debugExceptionWidget.border#0f0f0f88
debugIcon.breakpointCurrentStackframeForeground#0f0f0f
debugIcon.breakpointDisabledForeground#0f0f0f33
debugIcon.breakpointForeground#0f0f0f
debugIcon.breakpointStackframeForeground#0f0f0f
debugIcon.breakpointUnverifiedForeground#0f0f0f
debugIcon.continueForeground#0f0f0f
debugIcon.disconnectForeground#0f0f0f
debugIcon.pauseForeground#0f0f0f
debugIcon.restartForeground#0f0f0f
debugIcon.startForeground#0f0f0f
debugIcon.stepBackForeground#0f0f0f
debugIcon.stepIntoForeground#0f0f0f
debugIcon.stepOutForeground#0f0f0f
debugIcon.stepOverForeground#0f0f0f
debugIcon.stopForeground#0f0f0f
debugTokenExpression.boolean#0f0f0f
debugTokenExpression.error#b10207
debugTokenExpression.name#0f0f0f
debugTokenExpression.number#0f0f0f
debugTokenExpression.string#0f0f0f
debugTokenExpression.value#0f0f0f88
debugToolBar.background#f0f0f0
debugToolBar.border#0f0f0f88
debugView.exceptionLabelBackground#f0f0f0
debugView.exceptionLabelForeground#b10207
debugView.stateLabelBackground#f0f0f0
debugView.stateLabelForeground#0f0f0f
debugView.valueChangedHighlight#0f0f0f33
descriptionForeground#0f0f0f
diffEditor.border#0f0f0f88
diffEditor.diagonalFill#0f0f0f33
diffEditor.insertedLineBackground#0f0f0f11
diffEditor.insertedTextBackground#0f0f0f33
diffEditor.insertedTextBorder#0f0f0f88
diffEditor.move.border#0f0f0f88
diffEditor.moveActive.border#0f0f0f
diffEditor.removedLineBackground#0f0f0f11
diffEditor.removedTextBackground#0f0f0f33
diffEditor.removedTextBorder#0f0f0f88
diffEditor.unchangedCodeBackground#f0f0f0
diffEditor.unchangedRegionBackground#f0f0f0
diffEditorGutter.insertedLineBackground#0f0f0f11
diffEditorGutter.removedLineBackground#0f0f0f11
diffEditorOverview.insertedForeground#0f0f0f33
diffEditorOverview.removedForeground#0f0f0f33
disabledForeground#0f0f0f88
dropdown.background#f0f0f0
dropdown.border#0f0f0f88
dropdown.foreground#0f0f0f
dropdown.listBackground#f0f0f0
editor.background#f0f0f0
editor.findMatchBackground#0f0f0f88
editor.findMatchBorder#0f0f0f88
editor.findMatchHighlightBackground#0f0f0f11
editor.findMatchHighlightBorder#0f0f0f88
editor.findRangeHighlightBackground#0f0f0f11
editor.findRangeHighlightBorder#0f0f0f88
editor.focusedStackFrameHighlightBackground#f0f0f0
editor.foldBackground#0f0f0f11
editor.foreground#0f0f0f
editor.inactiveSelectionBackground#0f0f0f11
editor.inlineValuesBackground#c3c3c3
editor.inlineValuesForeground#0f0f0f
editor.lineHighlightBackground#0f0f0f11
editor.lineHighlightBorder#0f0f0f11
editor.linkedEditingBackground#0f0f0f33
editor.rangeHighlightBackground#0f0f0f11
editor.rangeHighlightBorder#0f0f0f88
editor.selectionBackground#0f0f0f33
editor.selectionForeground#0f0f0f
editor.selectionHighlightBackground#0f0f0f11
editor.selectionHighlightBorder#0f0f0f88
editor.snippetFinalTabstopHighlightBackground#f0f0f0
editor.snippetFinalTabstopHighlightBorder#0f0f0f88
editor.snippetTabstopHighlightBackground#f0f0f0
editor.snippetTabstopHighlightBorder#0f0f0f88
editor.stackFrameHighlightBackground#f0f0f0
editor.symbolHighlightBackground#0f0f0f33
editor.symbolHighlightBorder#0f0f0f88
editor.wordHighlightBackground#0f0f0f33
editor.wordHighlightBorder#0f0f0f88
editor.wordHighlightStrongBackground#0f0f0f88
editor.wordHighlightStrongBorder#0f0f0f88
editorBracketHighlight.foreground1#0f0f0f
editorBracketHighlight.foreground2#0f0f0f
editorBracketHighlight.foreground3#0f0f0f
editorBracketHighlight.foreground4#0f0f0f
editorBracketHighlight.foreground5#0f0f0f
editorBracketHighlight.foreground6#0f0f0f
editorBracketHighlight.unexpectedBracket.foreground#b10207
editorBracketMatch.background#f0f0f0
editorBracketMatch.border#0f0f0f88
editorBracketPairGuide.activeBackground1#0f0f0f33
editorBracketPairGuide.activeBackground2#0f0f0f33
editorBracketPairGuide.activeBackground3#0f0f0f33
editorBracketPairGuide.activeBackground4#0f0f0f33
editorBracketPairGuide.activeBackground5#0f0f0f33
editorBracketPairGuide.activeBackground6#0f0f0f33
editorBracketPairGuide.background1#0f0f0f11
editorBracketPairGuide.background2#0f0f0f11
editorBracketPairGuide.background3#0f0f0f11
editorBracketPairGuide.background4#0f0f0f11
editorBracketPairGuide.background5#0f0f0f11
editorBracketPairGuide.background6#0f0f0f11
editorCodeLens.foreground#0f0f0f
editorCommentsWidget.rangeBackground#0f0f0f11
editorCommentsWidget.resolvedBorder#0f0f0f88
editorCommentsWidget.unresolvedBorder#0f0f0f
editorCursor.background#f0f0f0
editorCursor.foreground#0f0f0f
editorError.border#f0f0f0
editorError.foreground#b10207
editorGhostText.background#f0f0f0
editorGhostText.border#0f0f0f33
editorGhostText.foreground#0f0f0f88
editorGroup.border#0f0f0f88
editorGroup.dropBackground#0f0f0f33
editorGroup.dropIntoPromptBackground#f0f0f0
editorGroup.dropIntoPromptForeground#0f0f0f
editorGroup.emptyBackground#f0f0f0
editorGroup.focusedEmptyBorder#0f0f0f88
editorGroupHeader.noTabsBackground#f0f0f0
editorGroupHeader.tabsBackground#f0f0f0
editorGroupHeader.tabsBorder#0f0f0f88
editorGutter.addedBackground#0f0f0f33
editorGutter.background#f0f0f0
editorGutter.commentGlyphForeground#0f0f0f
editorGutter.commentRangeForeground#0f0f0f33
editorGutter.commentUnresolvedGlyphForeground#0f0f0f
editorGutter.deletedBackground#0f0f0f33
editorGutter.foldingControlForeground#0f0f0f
editorGutter.modifiedBackground#0f0f0f33
editorHint.border#0f0f0f88
editorHint.foreground#0f0f0f
editorHoverWidget.background#c3c3c3
editorHoverWidget.border#0f0f0f88
editorHoverWidget.foreground#0f0f0f
editorHoverWidget.highlightForeground#0f0f0f
editorHoverWidget.statusBarBackground#0f0f0f33
editorInfo.border#f0f0f0
editorInfo.foreground#728239
editorInlayHint.background#c3c3c3
editorInlayHint.foreground#0f0f0f88
editorInlayHint.parameterBackground#c3c3c3
editorInlayHint.parameterForeground#0f0f0f88
editorInlayHint.typeBackground#c3c3c3
editorInlayHint.typeForeground#0f0f0f88
editorLightBulb.foreground#0f0f0f88
editorLightBulbAi.foreground#0f0f0f
editorLightBulbAutoFix.foreground#0f0f0f88
editorLineNumber.activeForeground#0f0f0f
editorLineNumber.dimmedForeground#0f0f0f33
editorLineNumber.foreground#0f0f0f33
editorLink.activeForeground#0f0f0f
editorMarkerNavigation.background#0f0f0f33
editorMarkerNavigationError.background#0f0f0f33
editorMarkerNavigationInfo.background#0f0f0f33
editorMarkerNavigationWarning.background#0f0f0f33
editorOverviewRuler.addedForeground#0f0f0f33
editorOverviewRuler.border#0f0f0f88
editorOverviewRuler.bracketMatchForeground#0f0f0f33
editorOverviewRuler.commonContentForeground#0f0f0f33
editorOverviewRuler.currentContentForeground#0f0f0f33
editorOverviewRuler.deletedForeground#0f0f0f33
editorOverviewRuler.errorForeground#0f0f0f88
editorOverviewRuler.findMatchForeground#0f0f0f33
editorOverviewRuler.incomingContentForeground#0f0f0f33
editorOverviewRuler.infoForeground#0f0f0f33
editorOverviewRuler.modifiedForeground#0f0f0f33
editorOverviewRuler.rangeHighlightForeground#0f0f0f33
editorOverviewRuler.selectionHighlightForeground#0f0f0f33
editorOverviewRuler.warningForeground#0f0f0f33
editorOverviewRuler.wordHighlightForeground#0f0f0f33
editorOverviewRuler.wordHighlightStrongForeground#0f0f0f33
editorPane.background#0f0f0f33
editorRuler.foreground#0f0f0f
editorStickyScroll.background#f0f0f0
editorStickyScrollHover.background#c3c3c3
editorSuggestWidget.background#f0f0f0
editorSuggestWidget.border#0f0f0f88
editorSuggestWidget.focusHighlightForeground#0f0f0f
editorSuggestWidget.foreground#0f0f0f
editorSuggestWidget.highlightForeground#0f0f0f
editorSuggestWidget.selectedBackground#0f0f0f88
editorSuggestWidget.selectedForeground#0f0f0f
editorSuggestWidget.selectedIconForeground#0f0f0f
editorSuggestWidgetStatus.foreground#0f0f0f88
editorUnicodeHighlight.background#0f0f0f11
editorUnicodeHighlight.border#0f0f0f33
editorUnnecessaryCode.border#0f0f0f88
editorUnnecessaryCode.opacity#0f0f0f33
editorWarning.border#f0f0f0
editorWarning.foreground#fe982a
editorWhitespace.foreground#0f0f0f33
editorWidget.background#f0f0f0
editorWidget.border#0f0f0f88
editorWidget.foreground#0f0f0f
editorWidget.resizeBorder#0f0f0f88
errorForeground#0f0f0f
extensionBadge.remoteBackground#f0f0f0
extensionBadge.remoteForeground#0f0f0f
extensionButton.background#c3c3c3
extensionButton.foreground#0f0f0f
extensionButton.hoverBackground#0f0f0f33
extensionButton.prominentBackground#f0f0f0
extensionButton.prominentForeground#0f0f0f
extensionButton.prominentHoverBackground#f0f0f0
extensionButton.separator#0f0f0f88
extensionIcon.preReleaseForeground#0f0f0f
extensionIcon.sponsorForeground#0f0f0f
extensionIcon.starForeground#0f0f0f
extensionIcon.verifiedForeground#0f0f0f
focusBorder#0f0f0f88
foreground#0f0f0f
gauge.background#f0f0f0
gauge.border#0f0f0f88
gauge.errorBackground#f0f0f0
gauge.errorForeground#b10207
gauge.foreground#0f0f0f
gauge.warningBackground#f0f0f0
gauge.warningForeground#fe982a
git.blame.editorDecorationForeground#0f0f0f
gitDecoration.addedResourceForeground#0f0f0f
gitDecoration.conflictingResourceForeground#0f0f0f
gitDecoration.deletedResourceForeground#0f0f0f
gitDecoration.ignoredResourceForeground#0f0f0f88
gitDecoration.modifiedResourceForeground#0f0f0f
gitDecoration.renamedResourceForeground#0f0f0f
gitDecoration.stageDeletedResourceForeground#0f0f0f
gitDecoration.stageModifiedResourceForeground#0f0f0f
gitDecoration.submoduleResourceForeground#0f0f0f
gitDecoration.untrackedResourceForeground#0f0f0f
icon.foreground#0f0f0f
inlineChat.background#f0f0f0
inlineChat.border#0f0f0f88
inlineChat.shadow#0f0f0f33
inlineChatDiff.inserted#0f0f0f11
inlineChatDiff.removed#0f0f0f11
inlineChatInput.background#f0f0f0
inlineChatInput.border#0f0f0f88
inlineChatInput.focusBorder#0f0f0f
inlineChatInput.placeholderForeground#0f0f0f88
input.background#f0f0f0
input.border#0f0f0f88
input.foreground#0f0f0f
input.placeholderForeground#0f0f0f88
inputOption.activeBackground#0f0f0f33
inputOption.activeBorder#0f0f0f88
inputOption.activeForeground#0f0f0f
inputOption.hoverBackground#0f0f0f11
inputValidation.errorBackground#f0f0f0
inputValidation.errorBorder#0f0f0f88
inputValidation.errorForeground#0f0f0f
inputValidation.infoBackground#f0f0f0
inputValidation.infoBorder#0f0f0f88
inputValidation.infoForeground#0f0f0f
inputValidation.warningBackground#f0f0f0
inputValidation.warningBorder#0f0f0f88
inputValidation.warningForeground#0f0f0f
interactive.activeCodeBorder#0f0f0f
interactive.inactiveCodeBorder#0f0f0f88
keybindingLabel.background#c3c3c3
keybindingLabel.border#0f0f0f33
keybindingLabel.bottomBorder#0f0f0f88
keybindingLabel.foreground#0f0f0f
keybindingTable.headerBackground#c3c3c3
keybindingTable.rowsBackground#0f0f0f11
list.activeSelectionBackground#0f0f0f
list.activeSelectionForeground#f0f0f0
list.activeSelectionIconForeground#f0f0f0
list.deemphasizedForeground#0f0f0f88
list.dropBackground#0f0f0f33
list.errorForeground#0f0f0f
list.filterMatchBackground#f0f0f0
list.filterMatchBorder#0f0f0f88
list.focusAndSelectionOutline#0f0f0f
list.focusBackground#0f0f0f88
list.focusForeground#0f0f0f
list.focusHighlightForeground#0f0f0f
list.focusOutline#0f0f0f88
list.highlightForeground#0f0f0f
list.hoverBackground#0f0f0f88
list.hoverForeground#0f0f0f
list.inactiveFocusBackground#0f0f0f33
list.inactiveSelectionBackground#0f0f0f33
list.inactiveSelectionForeground#0f0f0f
list.invalidItemForeground#0f0f0f
list.warningForeground#0f0f0f
listFilterWidget.background#f0f0f0
listFilterWidget.noMatchesOutline#0f0f0f88
listFilterWidget.outline#0f0f0f
listFilterWidget.shadow#0f0f0f33
menu.background#f0f0f0
menu.border#0f0f0f88
menu.foreground#0f0f0f
menu.selectionBackground#0f0f0f88
menu.selectionBorder#0f0f0f88
menu.selectionForeground#f0f0f0
menu.separatorBackground#0f0f0f88
menubar.selectionBackground#0f0f0f33
menubar.selectionBorder#0f0f0f88
menubar.selectionForeground#0f0f0f
merge.border#0f0f0f88
merge.commonContentBackground#0f0f0f11
merge.commonHeaderBackground#0f0f0f11
merge.currentContentBackground#0f0f0f11
merge.currentHeaderBackground#0f0f0f11
merge.incomingContentBackground#0f0f0f11
merge.incomingHeaderBackground#0f0f0f11
mergeEditor.change.background#0f0f0f11
mergeEditor.change.word.background#0f0f0f11
mergeEditor.conflict.handledFocused.border#0f0f0f
mergeEditor.conflict.handledUnfocused.border#0f0f0f88
mergeEditor.conflict.input1.background#0f0f0f11
mergeEditor.conflict.input2.background#0f0f0f11
mergeEditor.conflict.unhandledFocused.border#0f0f0f
mergeEditor.conflict.unhandledUnfocused.border#0f0f0f88
minimap.errorHighlight#b10207
minimap.findMatchHighlight#0f0f0f88
minimap.selectionHighlight#0f0f0f88
minimap.selectionOccurrenceHighlight#0f0f0f33
minimap.warningHighlight#fe982a
minimapGutter.addedBackground#47802b
minimapGutter.deletedBackground#ff0000
minimapGutter.modifiedBackground#045658
minimapSlider.activeBackground#0f0f0f33
minimapSlider.background#0f0f0f33
minimapSlider.hoverBackground#0f0f0f33
notebook.cellBorderColor#0f0f0f33
notebook.cellEditorBackground#f0f0f0
notebook.cellInsertionIndicator#0f0f0f
notebook.cellStatusBarItemHoverBackground#0f0f0f33
notebook.cellToolbarSeparator#0f0f0f33
notebook.editorBackground#f0f0f0
notebook.focusedCellBackground#0f0f0f11
notebook.focusedCellBorder#0f0f0f88
notebook.focusedEditorBorder#0f0f0f88
notebook.inactiveFocusedCellBorder#0f0f0f33
notebook.selectedCellBackground#0f0f0f33
notebook.selectedCellBorder#0f0f0f33
notebook.symbolHighlightBackground#0f0f0f11
notebookScrollbarSlider.activeBackground#0f0f0f33
notebookScrollbarSlider.background#0f0f0f33
notebookScrollbarSlider.hoverBackground#0f0f0f33
notebookStatusErrorIcon.foreground#b10207
notebookStatusRunningIcon.foreground#0f0f0f
notebookStatusSuccessIcon.foreground#728239
notificationCenter.border#0f0f0f88
notificationCenterHeader.background#f0f0f0
notificationCenterHeader.foreground#0f0f0f
notificationLink.foreground#0f0f0f
notifications.background#f0f0f0
notifications.border#0f0f0f88
notifications.foreground#0f0f0f
notificationsErrorIcon.foreground#b10207
notificationsInfoIcon.foreground#0f0f0f
notificationsWarningIcon.foreground#0f0f0f
notificationToast.border#0f0f0f88
outputView.background#f0f0f0
outputViewStickyScroll.background#f0f0f0
panel.background#f0f0f0
panel.border#0f0f0f88
panel.dropBorder#0f0f0f
panelInput.border#0f0f0f88
panelSection.border#0f0f0f88
panelSection.dropBackground#0f0f0f33
panelSectionHeader.background#0f0f0f11
panelSectionHeader.border#0f0f0f88
panelSectionHeader.foreground#0f0f0f
panelTitle.activeBorder#0f0f0f88
panelTitle.activeForeground#0f0f0f
panelTitle.inactiveForeground#0f0f0f88
peekView.border#0f0f0f88
peekViewEditor.background#f0f0f0
peekViewEditor.matchHighlightBackground#f0f0f0
peekViewEditor.matchHighlightBorder#0f0f0f88
peekViewEditorGutter.background#f0f0f0
peekViewResult.background#f0f0f0
peekViewResult.fileForeground#0f0f0f
peekViewResult.lineForeground#0f0f0f
peekViewResult.matchHighlightBackground#f0f0f0
peekViewResult.selectionBackground#f0f0f0
peekViewResult.selectionForeground#0f0f0f
peekViewTitle.background#f0f0f0
peekViewTitleDescription.foreground#0f0f0f
peekViewTitleLabel.foreground#0f0f0f
pickerGroup.border#0f0f0f88
pickerGroup.foreground#0f0f0f
ports.iconRunningProcessForeground#0f0f0f
problemsErrorIcon.foreground#b10207
problemsInfoIcon.foreground#0f0f0f
problemsWarningIcon.foreground#0f0f0f
profileBadge.background#c3c3c3
profileBadge.foreground#0f0f0f
progressBar.background#0f0f0f88
quickInput.background#f0f0f0
quickInput.foreground#0f0f0f
quickInputList.focusBackground#0f0f0f88
quickInputList.focusForeground#0f0f0f
quickInputList.focusIconForeground#0f0f0f
quickInputTitle.background#f0f0f0
sash.hoverBorder#0f0f0f88
scrollbar.shadow#0f0f0f33
scrollbarSlider.activeBackground#0f0f0f33
scrollbarSlider.background#0f0f0f33
scrollbarSlider.hoverBackground#0f0f0f33
searchEditor.findMatchBackground#f0f0f0
searchEditor.findMatchBorder#0f0f0f88
searchEditor.textInputBorder#0f0f0f88
selection.background#0f0f0f88
settings.checkboxBackground#f0f0f0
settings.checkboxBorder#0f0f0f88
settings.checkboxForeground#0f0f0f
settings.dropdownBackground#f0f0f0
settings.dropdownBorder#0f0f0f88
settings.dropdownForeground#0f0f0f
settings.dropdownListBorder#0f0f0f88
settings.focusedRowBackground#0f0f0f11
settings.focusedRowBorder#0f0f0f88
settings.headerBorder#0f0f0f88
settings.headerForeground#0f0f0f
settings.modifiedItemIndicator#0f0f0f88
settings.numberInputBackground#f0f0f0
settings.numberInputBorder#0f0f0f88
settings.numberInputForeground#0f0f0f
settings.rowHoverBackground#0f0f0f11
settings.sashBorder#0f0f0f88
settings.settingsHeaderHoverForeground#0f0f0f88
settings.textInputBackground#f0f0f0
settings.textInputBorder#0f0f0f88
settings.textInputForeground#0f0f0f
sideBar.background#f0f0f0
sideBar.border#0f0f0f88
sideBar.dropBackground#0f0f0f33
sideBar.foreground#0f0f0f
sideBarSectionHeader.background#0f0f0f33
sideBarSectionHeader.border#0f0f0f88
sideBarSectionHeader.foreground#0f0f0f
sideBarTitle.foreground#0f0f0f
simpleFindWidget.sashBorder#0f0f0f88
statusBar.background#0f0f0f33
statusBar.border#0f0f0f88
statusBar.debuggingBackground#0f0f0f
statusBar.debuggingBorder#0f0f0f88
statusBar.debuggingForeground#f0f0f0
statusBar.focusBorder#0f0f0f
statusBar.foreground#0f0f0f
statusBar.noFolderBackground#f0f0f0
statusBar.noFolderBorder#0f0f0f88
statusBar.noFolderForeground#0f0f0f
statusBarItem.activeBackground#f0f0f0
statusBarItem.compactHoverBackground#0f0f0f33
statusBarItem.errorBackground#b10207
statusBarItem.errorForeground#f0f0f0
statusBarItem.errorHoverBackground#b10207
statusBarItem.errorHoverForeground#f0f0f0
statusBarItem.focusBorder#0f0f0f
statusBarItem.hoverBackground#f0f0f0
statusBarItem.offlineBackground#f0f0f0
statusBarItem.offlineForeground#0f0f0f88
statusBarItem.prominentBackground#f0f0f0
statusBarItem.prominentForeground#0f0f0f
statusBarItem.prominentHoverBackground#f0f0f0
statusBarItem.remoteBackground#f0f0f0
statusBarItem.remoteForeground#0f0f0f
statusBarItem.warningBackground#fe982a
statusBarItem.warningForeground#f0f0f0
statusBarItem.warningHoverBackground#fe982a
statusBarItem.warningHoverForeground#f0f0f0
symbolIcon.arrayForeground#0f0f0f
symbolIcon.booleanForeground#0f0f0f
symbolIcon.classForeground#0f0f0f
symbolIcon.colorForeground#0f0f0f
symbolIcon.constantForeground#0f0f0f
symbolIcon.constructorForeground#0f0f0f
symbolIcon.enumeratorForeground#0f0f0f
symbolIcon.enumeratorMemberForeground#0f0f0f
symbolIcon.eventForeground#0f0f0f
symbolIcon.fieldForeground#0f0f0f
symbolIcon.fileForeground#0f0f0f
symbolIcon.folderForeground#0f0f0f
symbolIcon.functionForeground#0f0f0f
symbolIcon.interfaceForeground#0f0f0f
symbolIcon.keyForeground#0f0f0f
symbolIcon.keywordForeground#0f0f0f
symbolIcon.methodForeground#0f0f0f
symbolIcon.moduleForeground#0f0f0f
symbolIcon.namespaceForeground#0f0f0f
symbolIcon.nullForeground#0f0f0f
symbolIcon.numberForeground#0f0f0f
symbolIcon.objectForeground#0f0f0f
symbolIcon.operatorForeground#0f0f0f
symbolIcon.packageForeground#0f0f0f
symbolIcon.propertyForeground#0f0f0f
symbolIcon.referenceForeground#0f0f0f
symbolIcon.snippetForeground#0f0f0f
symbolIcon.stringForeground#0f0f0f
symbolIcon.structForeground#0f0f0f
symbolIcon.textForeground#0f0f0f
symbolIcon.typeParameterForeground#0f0f0f
symbolIcon.unitForeground#0f0f0f
symbolIcon.variableForeground#0f0f0f
tab.activeBackground#0f0f0f33
tab.activeBorder#f0f0f0
tab.activeBorderTop#f0f0f0
tab.activeForeground#0f0f0f
tab.activeModifiedBorder#0f0f0f88
tab.border#f0f0f0
tab.hoverBackground#0f0f0f33
tab.hoverBorder#f0f0f0
tab.inactiveBackground#f0f0f0
tab.inactiveForeground#0f0f0f88
tab.inactiveModifiedBorder#f0f0f0
tab.lastPinnedBorder#0f0f0f33
tab.unfocusedActiveBackground#0f0f0f33
tab.unfocusedActiveBorder#f0f0f0
tab.unfocusedActiveBorderTop#f0f0f0
tab.unfocusedActiveForeground#0f0f0f
tab.unfocusedActiveModifiedBorder#f0f0f0
tab.unfocusedHoverBackground#0f0f0f33
tab.unfocusedHoverBorder#f0f0f0
tab.unfocusedInactiveBackground#f0f0f0
tab.unfocusedInactiveForeground#0f0f0f88
tab.unfocusedInactiveModifiedBorder#f0f0f0
terminal.ansiBlack#0f0f0f
terminal.ansiBlue#1e1e1e
terminal.ansiBrightBlack#0f0f0f
terminal.ansiBrightBlue#1e1e1e
terminal.ansiBrightCyan#5a5a5a
terminal.ansiBrightGreen#3c3c3c
terminal.ansiBrightMagenta#2d2d2d
terminal.ansiBrightRed#4b4b4b
terminal.ansiBrightWhite#787878
terminal.ansiBrightYellow#696969
terminal.ansiCyan#5a5a5a
terminal.ansiGreen#3c3c3c
terminal.ansiMagenta#2d2d2d
terminal.ansiRed#4b4b4b
terminal.ansiWhite#787878
terminal.ansiYellow#696969
terminal.background#f0f0f0
terminal.border#0f0f0f88
terminal.dropBackground#0f0f0f33
terminal.findMatchBackground#0f0f0f33
terminal.findMatchBorder#0f0f0f88
terminal.findMatchHighlightBackground#0f0f0f11
terminal.findMatchHighlightBorder#0f0f0f88
terminal.foreground#0f0f0f
terminal.hoverHighlightBackground#0f0f0f11
terminal.inactiveSelectionBackground#0f0f0f11
terminal.selectionBackground#0f0f0f33
terminal.tab.activeBorder#0f0f0f
terminalCommandDecoration.defaultBackground#0f0f0f33
terminalCommandDecoration.errorBackground#b10207
terminalCommandDecoration.successBackground#728239
terminalCursor.background#f0f0f0
terminalCursor.foreground#0f0f0f
terminalOverviewRuler.cursorForeground#0f0f0f
terminalOverviewRuler.findMatchForeground#0f0f0f88
terminalStickyScroll.background#f0f0f0
terminalStickyScrollHover.background#c3c3c3
testing.iconErrored#b10207
testing.iconFailed#b10207
testing.iconPassed#728239
testing.iconQueued#0f0f0f
testing.iconSkipped#0f0f0f88
testing.iconUnset#0f0f0f88
testing.message.error.lineBackground#b1020733
testing.message.info.decorationForeground#0f0f0f
testing.message.info.lineBackground#0f0f0f33
testing.peekBorder#0f0f0f88
testing.peekHeaderBackground#0f0f0f11
testing.runAction#0f0f0f
textBlockQuote.background#f0f0f0
textBlockQuote.border#0f0f0f88
textCodeBlock.background#f0f0f0
textLink.activeForeground#0f0f0f
textLink.foreground#0f0f0f88
textPreformat.foreground#0f0f0f
textSeparator.foreground#0f0f0f
titleBar.activeBackground#f0f0f0
titleBar.activeForeground#0f0f0f
titleBar.border#0f0f0f88
titleBar.inactiveBackground#f0f0f0
titleBar.inactiveForeground#0f0f0f
toolbar.activeBackground#0f0f0f33
toolbar.hoverBackground#0f0f0f11
toolbar.hoverOutline#0f0f0f33
tree.inactiveIndentGuidesStroke#0f0f0f88
tree.indentGuidesStroke#0f0f0f
tree.tableColumnsBorder#0f0f0f88
tree.tableOddRowsBackground#0f0f0f11
walkThrough.embeddedEditorBackground#f0f0f0
walkthrough.stepTitle.foreground#0f0f0f
welcomePage.background#f0f0f0
welcomePage.progress.background#f0f0f0
welcomePage.progress.foreground#0f0f0f
welcomePage.tileBackground#c3c3c3
welcomePage.tileBorder#0f0f0f88
welcomePage.tileHoverBackground#0f0f0f33
widget.shadow#0f0f0f33
window.activeBorder#0f0f0f88
window.inactiveBorder#0f0f0f33

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment	#0F0F0F33	—
keyword, storage	#0F0F0F88	—
entity, strong	—	bold
invalid	#0F0F0F88	italic underline
token.info-token	#316BCD	—
token.warn-token	#CD9731	—
token.error-token	#CD3131	—
token.debug-token	#800080	—

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