Chicha

Name: Chicha
Author: Benito Anagua

Publisher: Benito AnaguaThemes in package: 4

Soft, light, dark and black theme with refreshing purple and blue tones

Open in VS Code

Color themes

VS Code preview

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

Chicha — Chicha Black

fetchUser.ts

index.ts

README.md

srccomponentsfetchUser.tsfetchUser

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
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}!`;
}

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#6d63b8
activityBar.background#151115
activityBar.border#2d262e
activityBar.dropBorder#5447a0
activityBar.foreground#5447a0
activityBar.inactiveForeground#aeaba2
activityBarBadge.background#6d63b8
activityBarBadge.foreground#000000
badge.background#6d63b8
badge.foreground#000000
breadcrumb.activeSelectionForeground#2d262e
breadcrumb.background#151115
breadcrumb.focusForeground#898189
breadcrumb.foreground#cecab3
breadcrumbPicker.background#151115
button.background#5447a0
button.border#2d262e
button.foreground#000000
button.hoverBackground#8b83c2
button.secondaryBackground#706874
button.secondaryForeground#000000
button.secondaryHoverBackground#aeaba2
button.separator#423b46
chat.requestBackground#151115
chat.requestBorder#423b46
checkbox.background#000000
checkbox.border#000000
checkbox.foreground#aeaba2
debugConsole.errorForeground#479e41
debugConsole.infoForeground#e8e4c2
debugConsole.sourceForeground#aeaba2
debugConsole.warningForeground#ccd62d
debugConsoleInputIcon.foreground#706874
debugExceptionWidget.background#1d123f
debugExceptionWidget.border#261a51
debugIcon.breakpointForeground#2c822c
debugIcon.continueForeground#a356dc
debugIcon.pauseForeground#382974
debugIcon.restartForeground#6626a2
debugIcon.startForeground#842fcc
debugIcon.stopForeground#479e41
debugTokenExpression.boolean#898189
debugTokenExpression.error#479e41
debugTokenExpression.name#e8e4c2
debugTokenExpression.number#706874
debugTokenExpression.string#cecab3
debugTokenExpression.value#aeaba2
debugToolBar.background#1d123f
debugToolBar.border#261a51
debugView.valueChangedHighlight#706d21
descriptionForeground#706874
diffEditor.border#382974
diffEditor.insertedTextBackground#561f8b80
diffEditor.removedTextBackground#8a161b80
diffEditorOverview.insertedForeground#561f8b
diffEditorOverview.removedForeground#226822
disabledForeground#58505e
dropdown.background#000000
dropdown.border#382974
dropdown.foreground#aeaba2
editor.background#000000
editor.findMatchBackground#461774
editor.findMatchBorder#842fcc
editor.findMatchForeground#aeaba2
editor.findMatchHighlightBackground#6626a280
editor.findMatchHighlightBorder#d32a28
editor.findRangeHighlightBackground#58505e80
editor.findRangeHighlightBorder#15111580
editor.focusedStackFrameHighlightBackground#2f2163
editor.foldBackground#261a5180
editor.foldPlaceholderForeground#2d262e
editor.foreground#e8e4c2
editor.hoverHighlightBackground#774e1980
editor.inactiveSelectionBackground#38297459
editor.lineHighlightBackground#1d123f
editor.lineHighlightBorder#261a51
editor.linkedEditingBackground#2d262e
editor.rangeHighlightBackground#15111580
editor.rangeHighlightBorder#151115
editor.selectionBackground#561f8b59
editor.selectionHighlightBackground#38297459
editor.selectionHighlightBorder#842fcc
editor.stackFrameHighlightBackground#261a51
editor.wordHighlightBackground#774e1980
editor.wordHighlightBorder#2d262e
editor.wordHighlightStrongBackground#2f216380
editor.wordHighlightStrongBorder#58505e
editorCodeLens.foreground#706874
editorCommentsWidget.rangeActiveBackground#151115
editorCommentsWidget.rangeBackground#2d262e
editorCommentsWidget.replyInputBackground#151115
editorCommentsWidget.resolvedBorder#423b46
editorCommentsWidget.unresolvedBorder#58505e
editorCursor.background#151115
editorCursor.foreground#e8e4c2
editorGhostText.background#000000
editorGhostText.border#2d262e
editorGhostText.foreground#e8e4c2
editorGroup.border#000000
editorGroup.dropBackground#261a51
editorGroup.dropIntoPromptBackground#423b46
editorGroup.dropIntoPromptBorder#58505e
editorGroup.dropIntoPromptForeground#e8e4c2
editorGroup.emptyBackground#000000
editorGroup.focusedEmptyBorder#706874
editorGroupHeader.border#58505e
editorGroupHeader.tabsBackground#151115
editorGroupHeader.tabsBorder#423b46
editorGutter.addedBackground#842fcc
editorGutter.background#15111540
editorGutter.commentGlyphForeground#706874
editorGutter.commentRangeForeground#261a51
editorGutter.commentUnresolvedGlyphForeground#898189
editorGutter.deletedBackground#7bcc6d
editorGutter.foldingControlForeground#e8e4c2
editorGutter.modifiedBackground#5447a0
editorHoverWidget.background#000000
editorHoverWidget.border#382974
editorHoverWidget.foreground#e8e4c2
editorHoverWidget.highlightForeground#842fcc
editorHoverWidget.statusBarBackground#151115
editorIndentGuide.activeBackground1#382974
editorIndentGuide.background1#2d262e
editorInlayHint.background#000000
editorInlayHint.foreground#423b46
editorLightBulb.foreground#ccd62d
editorLightBulbAi.foreground#d59c2f
editorLightBulbAutoFix.foreground#842fcc
editorLineNumber.activeForeground#e8e4c2
editorLineNumber.foreground#58505e
editorLink.activeForeground#8b83c2
editorMarkerNavigation.background#000000
editorMarkerNavigationError.background#479e41
editorMarkerNavigationInfo.background#403086
editorMarkerNavigationWarning.background#ccd62d
editorOverviewRuler.addedForeground#561f8b
editorOverviewRuler.background#151115
editorOverviewRuler.border#423b46
editorOverviewRuler.bracketMatchForeground#423b46
editorOverviewRuler.commonContentForeground#5447a0
editorOverviewRuler.currentContentForeground#d59c2f
editorOverviewRuler.deletedForeground#226822
editorOverviewRuler.errorForeground#479e41
editorOverviewRuler.findMatchForeground#561f8b80
editorOverviewRuler.incomingContentForeground#403086
editorOverviewRuler.infoForeground#b07a26
editorOverviewRuler.inlineChatRemoved#226822
editorOverviewRuler.modifiedForeground#916322
editorOverviewRuler.rangeHighlightForeground#2d262e
editorOverviewRuler.selectionHighlightForeground#15111580
editorOverviewRuler.warningForeground#6626a2
editorOverviewRuler.wordHighlightForeground#58505e
editorOverviewRuler.wordHighlightStrongForeground#706874
editorOverviewRuler.wordHighlightTextForeground#898189
editorRuler.foreground#58505e
editorStickyScroll.background#000000
editorStickyScroll.border#382974
editorStickyScrollHover.background#461774
editorSuggestWidget.background#000000
editorSuggestWidget.border#382974
editorSuggestWidget.foreground#e8e4c2
editorSuggestWidget.highlightForeground#5447a0
editorSuggestWidget.selectedBackground#261a51
editorSuggestWidget.selectedForeground#e8e4c2
editorSuggestWidgetStatus.foreground#aeaba2
editorUnicodeHighlight.background#151115
editorUnicodeHighlight.border#479e41
editorWatermark.foreground#706874
editorWhitespace.foreground#2d262e
editorWidget.background#151115
editorWidget.border#2d262e
editorWidget.foreground#aeaba2
editorWidget.resizeBorder#706874
errorForeground#7bcc6d
focusBorder#382974
foreground#e8e4c2
git.blame.editorDecorationForeground#706874
gitDecoration.addedResourceForeground#b673e4
gitDecoration.conflictingResourceForeground#60b9d2
gitDecoration.deletedResourceForeground#479e41
gitDecoration.ignoredResourceForeground#58505e
gitDecoration.modifiedResourceForeground#e3f394
gitDecoration.stageDeletedResourceForeground#479e41
gitDecoration.stageModifiedResourceForeground#e3f394
gitDecoration.submoduleResourceForeground#5447a0
gitDecoration.untrackedResourceForeground#7bcc6d
icon.foreground#aeaba2
input.background#000000
input.border#2d262e
input.foreground#aeaba2
input.placeholderForeground#706874
inputOption.activeBackground#261a51
inputOption.activeBorder#000000
inputOption.activeForeground#e8e4c2
inputOption.hoverBackground#2d262e
list.activeSelectionBackground#261a51
list.activeSelectionForeground#e8e4c2
list.deemphasizedForeground#706874
list.dropBackground#261a51
list.dropBetweenBackground#423b46
list.errorForeground#e4756c
list.filterMatchBackground#adae26
list.filterMatchBorder#8d8b25
list.focusAndSelectionOutline#382974
list.focusBackground#2f2163
list.focusForeground#aeaba2
list.focusHighlightForeground#d59c2f
list.focusOutline#382974
list.highlightForeground#d59c2f
list.hoverBackground#261a51
list.hoverForeground#e8e4c2
list.inactiveFocusBackground#2f2163
list.inactiveFocusOutline#382974
list.inactiveSelectionBackground#2f2163
list.inactiveSelectionForeground#e8e4c2
list.warningForeground#dceb7e
listFilterWidget.background#700e14
listFilterWidget.noMatchesOutline#479e41
listFilterWidget.outline#151115
menu.background#151115
menu.border#2d262e
menu.foreground#cecab3
menu.selectionBackground#8b83c2
menu.selectionForeground#151115
menu.separatorBackground#2d262e
menubar.selectionBackground#2f2163
menubar.selectionForeground#c2c1d3
merge.border#5447a0
merge.commonContentBackground#423b4680
merge.commonHeaderBackground#70687480
merge.currentContentBackground#38297480
merge.currentHeaderBackground#5447a080
merge.incomingContentBackground#91632280
merge.incomingHeaderBackground#d59c2f80
mergeEditor.change.background#261a51
mergeEditor.change.word.background#2f2163
mergeEditor.changeBase.background#151115
mergeEditor.changeBase.word.background#2d262e
mergeEditor.conflict.handled.minimapOverViewRuler#382974
mergeEditor.conflict.handledFocused.border#6626a2
mergeEditor.conflict.handledUnfocused.border#561f8b
mergeEditor.conflict.input1.background#5c3a10
mergeEditor.conflict.input2.background#774e19
mergeEditor.conflict.unhandled.minimapOverViewRuler#403086
mergeEditor.conflict.unhandledFocused.border#2c822c
mergeEditor.conflict.unhandledUnfocused.border#226822
mergeEditor.conflictingLines.background#151115
minimap.background#151115
minimap.errorHighlight#479e41
minimap.findMatchHighlight#70687480
minimap.foregroundOpacity#e8e4c21a
minimap.infoHighlight#e4c169
minimap.selectionHighlight#d59c2f80
minimap.selectionOccurrenceHighlight#aeaba2
minimap.warningHighlight#ccd62d
notebook.cellBorderColor#2d262e
notebook.cellEditorBackground#000000
notebook.cellHoverBackground#151115
notebook.cellInsertionIndicator#423b46
notebook.cellStatusBarItemHoverBackground#151115
notebook.cellToolbarSeparator#2d262e
notebook.editorBackground#000000
notebook.focusedCellBackground#151115
notebook.focusedCellBorder#2d262e
notebook.focusedEditorBorder#423b46
notebook.inactiveFocusedCellBorder#151115
notebook.inactiveSelectedCellBorder#151115
notebook.outputContainerBackgroundColor#000000
notebook.outputContainerBorderColor#2d262e
notebook.selectedCellBackground#aeaba2
notebook.selectedCellBorder#151115
notebookScrollbarSlider.activeBackground#151115
notebookScrollbarSlider.background#aeaba2
notebookScrollbarSlider.hoverBackground#151115
notificationCenter.border#261a51
notificationCenterHeader.background#000000
notificationCenterHeader.foreground#aeaba2
notifications.background#1d123f
notifications.border#000000
notifications.foreground#aeaba2
notificationsErrorIcon.foreground#479e41
notificationsInfoIcon.foreground#403086
notificationsWarningIcon.foreground#ccd62d
notificationToast.border#261a51
outputView.background#000000
panel.background#000000
panel.border#382974
panel.dropBorder#261a51
panelSection.border#000000
panelSectionHeader.background#151115
panelSectionHeader.border#2d262e
panelSectionHeader.foreground#e8e4c2
panelStickyScroll.background#151115
panelStickyScroll.border#2d262e
panelTitle.activeBorder#382974
panelTitle.activeForeground#e8e4c2
panelTitle.border#000000
panelTitle.inactiveForeground#aeaba2
peekView.border#5447a0
peekViewEditor.background#1d123f
peekViewEditor.matchHighlightBackground#ccd62d
peekViewEditor.matchHighlightBorder#d0de50
peekViewEditorGutter.background#1d123f
peekViewResult.background#1d123f
peekViewResult.fileForeground#e8e4c2
peekViewResult.lineForeground#aeaba2
peekViewResult.matchHighlightBackground#700e14
peekViewResult.selectionBackground#261a51
peekViewResult.selectionForeground#aeaba2
peekViewTitle.background#000000
peekViewTitleDescription.foreground#aeaba2
peekViewTitleLabel.foreground#e8e4c2
pickerGroup.border#2d262e
pickerGroup.foreground#5447a0
problemsErrorIcon.foreground#479e41
problemsInfoIcon.foreground#d59c2f
problemsWarningIcon.foreground#842fcc
progressBar.background#5447a0
quickInput.background#000000
quickInput.foreground#e8e4c2
quickInputList.focusBackground#151115
quickInputList.focusForeground#e8e4c2
quickInputList.focusIconForeground#706874
quickInputTitle.background#151115
sash.hoverBorder#842fcc
scrollbarSlider.activeBackground#403086
scrollbarSlider.background#382974
scrollbarSlider.hoverBackground#382974
search.resultsInfoForeground#aeaba2
searchEditor.findMatchBackground#2f2163
searchEditor.findMatchBorder#382974
searchEditor.textInputBorder#403086
selection.background#382974
settings.focusedRowBackground#000000
settings.headerBorder#151115
settings.headerForeground#aeaba2
settings.sashBorder#2d262e
sideBar.background#151115
sideBar.border#2d262e
sideBar.dropBackground#151115
sideBar.foreground#e8e4c2
sideBarSectionHeader.background#2d262e
sideBarSectionHeader.border#423b46
sideBarSectionHeader.foreground#aeaba2
sideBarStickyScroll.background#2d262e
sideBarStickyScroll.border#58505e
sideBarTitle.background#2d262e
sideBarTitle.border#423b46
sideBarTitle.foreground#e8e4c2
sideBySideEditor.horizontalBorder#898189
sideBySideEditor.verticalBorder#aeaba2
statusBar.background#2f2163
statusBar.border#423b46
statusBar.debuggingBackground#61be54
statusBar.debuggingForeground#000000
statusBar.foreground#e8e4c2
statusBar.noFolderBackground#5447a0
statusBar.noFolderBorder#423b46
statusBar.noFolderForeground#000000
statusBarItem.activeBackground#000000
statusBarItem.hoverBackground#561f8b
statusBarItem.remoteBackground#561f8b
statusBarItem.remoteForeground#e8e4c2
tab.activeBackground#2f2163
tab.border#423b46
tab.hoverBackground#261a51
tab.hoverForeground#e8e4c2
tab.inactiveBackground#151115
tab.inactiveForeground#423b46
tab.selectedBackground#000000
tab.selectedForeground#e8e4c2
tab.unfocusedActiveBackground#2f2163
tab.unfocusedActiveForeground#898189
tab.unfocusedHoverBackground#151115
tab.unfocusedHoverForeground#aeaba2
tab.unfocusedInactiveBackground#151115
tab.unfocusedInactiveForeground#58505e
terminal.ansiBlack#e8e4c2
terminal.ansiBlue#8b83c2
terminal.ansiBrightBlack#aeaba2
terminal.ansiBrightBlue#5447a0
terminal.ansiBrightCyan#2e83a4
terminal.ansiBrightGreen#479e41
terminal.ansiBrightMagenta#842fcc
terminal.ansiBrightRed#d32a28
terminal.ansiBrightWhite#000000
terminal.ansiBrightYellow#ccd62d
terminal.ansiCyan#60b9d2
terminal.ansiGreen#7bcc6d
terminal.ansiMagenta#b673e4
terminal.ansiRed#e4756c
terminal.ansiWhite#2d262e
terminal.ansiYellow#d7e468
terminal.background#000000
terminal.border#000000
terminal.dropBackground#261a51
terminal.foreground#e8e4c2
terminal.inactiveSelectionBackground#151115
terminal.selectionBackground#423b46
terminalCommandDecoration.defaultBackground#151115
terminalCommandDecoration.errorBackground#226822
terminalCommandDecoration.successBackground#561f8b
terminalCursor.background#5447a0
terminalCursor.foreground#000000
terminalOverviewRuler.border#2d262e
terminalOverviewRuler.cursorForeground#174f19
terminalOverviewRuler.findMatchForeground#706d21
terminalStickyScroll.background#000000
terminalStickyScroll.border#2d262e
terminalStickyScrollHover.background#151115
testing.iconErrored#479e41
testing.iconFailed#2c822c
testing.iconPassed#842fcc
testing.iconQueued#adae26
testing.iconSkipped#b07a26
testing.iconUnset#423b46
testing.message.error.lineBackground#0e340f
testing.message.info.decorationForeground#e8e4c2
testing.message.info.lineBackground#5c3a10
testing.peekBorder#2d262e
testing.peekHeaderBackground#151115
testing.runAction#382974
textLink.activeForeground#842fcc
textLink.foreground#5447a0
titleBar.activeBackground#151115
titleBar.activeForeground#cecab3
titleBar.border#423b46
titleBar.inactiveBackground#2d262e
titleBar.inactiveForeground#e8e4c2
tree.inactiveIndentGuidesStroke#70687466
tree.indentGuidesStroke#706874
tree.tableColumnsBorder#423b4620
tree.tableOddRowsBackground#423b460a
walkThrough.embeddedEditorBackground#2d262e
walkthrough.stepTitle.foreground#e8e4c2
welcomePage.background#000000
welcomePage.progress.background#261a51
welcomePage.progress.foreground#2d262e
welcomePage.tileBackground#151115
welcomePage.tileBorder#2d262e
welcomePage.tileHoverBackground#261a51
widget.border#706874
window.activeBorder#382974
window.inactiveBorder#aeaba2

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment, comment.line, comment.block, comment.block.documentation, punctuation.definition.comment, meta.toc-list	#423b46	italic
constant, constant.numeric, constant.numeric.integer, constant.numeric.integer.binary, constant.numeric.integer.octal, constant.numeric.integer.decimal, constant.numeric.integer.hexadecimal, constant.numeric.integer.other, constant.numeric.float, constant.numeric.float.binary, constant.numeric.float.octal, constant.numeric.float.decimal, constant.numeric.float.hexadecimal, constant.numeric.float.other, constant.numeric.complex, constant.numeric.complex.real, constant.numeric.complex.imaginary, constant.language, constant.character.escape, constant.other.placeholder, constant.other	#60b9d2
entity.name.class, entity.name.struct, entity.name.enum, entity.name.union, entity.name.trait, entity.name.interface, entity.name.impl, entity.name.type, entity.name.class.ford-decl, entity.other.inherited-class, entity.name.function.constructor, entity.name.function.destructor, entity.name.namespace, entity.name.constant, entity.name.label, entity.name.tag, entity.name.section, entity.other.attribute-name	#8b83c2	bold
entity.name.function, entity.name.function.constructor, entity.name.function.destructor	#b673e4	bold italic
keyword, keyword.control, keyword.control.conditional, keyword.control.import, punctuation.definition.keyword, keyword.operator, keyword.operator.assignment, keyword.operator.arithmetic, keyword.operator.bitwise, keyword.operator.logical, keyword.operator.word, keyword.other	#e4c169
markup.heading, markup.list.numbered, markup.list.unnumbered, markup.bold, markup.italic, markup.underline, markup.inserted, markup.deleted, markup.underline.link, markup.quote, markup.raw.inline, markup.raw.block, markup.other	#e8e4c2
markup.underline	—	underline
markup.bold	#e4c169	bold
markup.heading	#7bcc6d	bold
markup.italic	—	italic
markup.inserted	#b673e4	—
markup.deleted	#7bcc6d	—
markup.changed	#e4c169	—
markup.inline.raw	#7bcc6d	—
punctuation.definition.tag	#7bcc6d	—
meta.class, meta.struct, meta.enum, meta.union, meta.trait, meta.interface, meta.impl, meta.type, meta.function, meta.function.parameters, meta.function.return-type, meta.namespace, meta.preprocessor, meta.annotation, meta.annotation.identifier, meta.annotation.parameters, meta.path, meta.function-call, meta.block, meta.braces, meta.group, meta.parens, meta.brackets, meta.generic, meta.tag, meta.paragraph	#aeaba2
storage, storage.type, storage.modifier, storage.type.function, storage.type.class, storage.type.struct, storage.type.enum, storage.type.union, storage.type.trait, storage.type.interface, storage.type.impl, storage.type keyword.declaration.type	#e4c169
string, string.quoted, string.quoted.single, string.quoted.double, string.quoted.triple, string.quoted.other, meta.string, punctuation.definition.string.begin, punctuation.definition.string.end, string.quoted.unquoted, string.quoted.regexp, meta.interpolated, punctuation.section.interpolation.begin, punctuation.section.interpolation.end, source.language-suffix.embedded	#7bcc6d
support, support.class, support.constant, support.function, support.other, support.property-value, support.type, support.variable, support.module	#e8e4c2	bold
support.class, support.function, support.module	#8b83c2	bold
support.constant, support.other, support.property-value, support.type, support.variable	#8b83c2
variable, variable.other, variable.other.readwrite, punctuation.definition.variable, variable.other.constant, variable.language, variable.parameter, variable.other.member, variable.function, variable.annotation, punctuation.definition.annotation	#e8e4c2
variable.language	#e8e4c2	italic
variable.other, variable.other.member	#b673e4
variable.parameter	#7bcc6d
	#e8e4c2
punctuation.separator, punctuation.terminator, punctuation.separator.continuation, punctuation.accessor	#aeaba2
source	#aeaba2
text.html, text.xml	#aeaba2
invalid, invalid.illegal, invalid.deprecated	#7bcc6d	underline
punctuation.definition.tag, punctuation.definition.annotation, punctuation.section.block.begin, punctuation.section.block.end, punctuation.section.braces.begin, punctuation.section.braces.end, punctuation.section.group.begin, punctuation.section.group.end, punctuation.section.parens.begin, punctuation.section.parens.end, punctuation.section.brackets.begin, punctuation.section.brackets.end, punctuation.definition.generic.begin, punctuation.definition.generic.end	#7bcc6d	—

VS Code preview

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

Chicha — Chicha Dark

fetchUser.ts

index.ts

README.md

srccomponentsfetchUser.tsfetchUser

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
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}!`;
}

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#8689C8
activityBar.background#312732
activityBar.border#463D4A
activityBar.dropBorder#6163B9
activityBar.foreground#6163B9
activityBar.inactiveForeground#C6C2BD
activityBarBadge.background#8689C8
activityBarBadge.foreground#1C121A
badge.background#8689C8
badge.foreground#1C121A
breadcrumb.activeSelectionForeground#463D4A
breadcrumb.background#312732
breadcrumb.focusForeground#A19BA2
breadcrumb.foreground#E2DDD2
breadcrumbPicker.background#312732
button.background#6163B9
button.border#463D4A
button.foreground#1C121A
button.hoverBackground#A5A7D3
button.secondaryBackground#87818E
button.secondaryForeground#1C121A
button.secondaryHoverBackground#C6C2BD
button.separator#5A5262
chat.requestBackground#312732
chat.requestBorder#5A5262
checkbox.background#1C121A
checkbox.border#1C121A
checkbox.foreground#C6C2BD
debugConsole.errorForeground#6EBA58
debugConsole.infoForeground#F6F2E7
debugConsole.sourceForeground#C6C2BD
debugConsole.warningForeground#DECF58
debugConsoleInputIcon.foreground#87818E
debugExceptionWidget.background#231E67
debugExceptionWidget.border#2A2678
debugIcon.breakpointForeground#4CA839
debugIcon.continueForeground#A980E5
debugIcon.pauseForeground#39369A
debugIcon.restartForeground#6630CB
debugIcon.startForeground#8756D8
debugIcon.stopForeground#6EBA58
debugTokenExpression.boolean#A19BA2
debugTokenExpression.error#6EBA58
debugTokenExpression.name#F6F2E7
debugTokenExpression.number#87818E
debugTokenExpression.string#E2DDD2
debugTokenExpression.value#C6C2BD
debugToolBar.background#231E67
debugToolBar.border#2A2678
debugView.valueChangedHighlight#98812C
descriptionForeground#87818E
diffEditor.border#39369A
diffEditor.insertedTextBackground#5828b580
diffEditor.removedTextBackground#b61d3d80
diffEditorOverview.insertedForeground#5828B5
diffEditorOverview.removedForeground#3E8F2E
disabledForeground#6F677A
dropdown.background#1C121A
dropdown.border#39369A
dropdown.foreground#C6C2BD
editor.background#1C121A
editor.findMatchBackground#4A209F
editor.findMatchBorder#8756D8
editor.findMatchForeground#C6C2BD
editor.findMatchHighlightBackground#6630cb80
editor.findMatchHighlightBorder#DE5066
editor.findRangeHighlightBackground#6f677a80
editor.findRangeHighlightBorder#31273280
editor.focusedStackFrameHighlightBackground#322E89
editor.foldBackground#2a267880
editor.foldPlaceholderForeground#463D4A
editor.foreground#F6F2E7
editor.hoverHighlightBackground#a1552280
editor.inactiveSelectionBackground#39369a59
editor.lineHighlightBackground#231E67
editor.lineHighlightBorder#2A2678
editor.linkedEditingBackground#463D4A
editor.rangeHighlightBackground#31273280
editor.rangeHighlightBorder#312732
editor.selectionBackground#5828b559
editor.selectionHighlightBackground#39369a59
editor.selectionHighlightBorder#8756D8
editor.stackFrameHighlightBackground#2A2678
editor.wordHighlightBackground#a1552280
editor.wordHighlightBorder#463D4A
editor.wordHighlightStrongBackground#322e8980
editor.wordHighlightStrongBorder#6F677A
editorCodeLens.foreground#87818E
editorCommentsWidget.rangeActiveBackground#312732
editorCommentsWidget.rangeBackground#463D4A
editorCommentsWidget.replyInputBackground#312732
editorCommentsWidget.resolvedBorder#5A5262
editorCommentsWidget.unresolvedBorder#6F677A
editorCursor.background#312732
editorCursor.foreground#F6F2E7
editorGhostText.background#1C121A
editorGhostText.border#463D4A
editorGhostText.foreground#F6F2E7
editorGroup.border#1C121A
editorGroup.dropBackground#2A2678
editorGroup.dropIntoPromptBackground#5A5262
editorGroup.dropIntoPromptBorder#6F677A
editorGroup.dropIntoPromptForeground#F6F2E7
editorGroup.emptyBackground#1C121A
editorGroup.focusedEmptyBorder#87818E
editorGroupHeader.border#6F677A
editorGroupHeader.tabsBackground#312732
editorGroupHeader.tabsBorder#5A5262
editorGutter.addedBackground#8756D8
editorGutter.background#31273240
editorGutter.commentGlyphForeground#87818E
editorGutter.commentRangeForeground#2A2678
editorGutter.commentUnresolvedGlyphForeground#A19BA2
editorGutter.deletedBackground#A9D993
editorGutter.foldingControlForeground#F6F2E7
editorGutter.modifiedBackground#6163B9
editorHoverWidget.background#1C121A
editorHoverWidget.border#39369A
editorHoverWidget.foreground#F6F2E7
editorHoverWidget.highlightForeground#8756D8
editorHoverWidget.statusBarBackground#312732
editorIndentGuide.activeBackground1#39369A
editorIndentGuide.background1#463D4A
editorInlayHint.background#1C121A
editorInlayHint.foreground#5A5262
editorLightBulb.foreground#DECF58
editorLightBulbAi.foreground#DE9A5A
editorLightBulbAutoFix.foreground#8756D8
editorLineNumber.activeForeground#F6F2E7
editorLineNumber.foreground#6F677A
editorLink.activeForeground#A5A7D3
editorMarkerNavigation.background#1C121A
editorMarkerNavigationError.background#6EBA58
editorMarkerNavigationInfo.background#403EAB
editorMarkerNavigationWarning.background#DECF58
editorOverviewRuler.addedForeground#5828B5
editorOverviewRuler.background#312732
editorOverviewRuler.border#5A5262
editorOverviewRuler.bracketMatchForeground#5A5262
editorOverviewRuler.commonContentForeground#6163B9
editorOverviewRuler.currentContentForeground#DE9A5A
editorOverviewRuler.deletedForeground#3E8F2E
editorOverviewRuler.errorForeground#6EBA58
editorOverviewRuler.findMatchForeground#5828b580
editorOverviewRuler.incomingContentForeground#403EAB
editorOverviewRuler.infoForeground#D37B36
editorOverviewRuler.inlineChatRemoved#3E8F2E
editorOverviewRuler.modifiedForeground#BA682C
editorOverviewRuler.rangeHighlightForeground#463D4A
editorOverviewRuler.selectionHighlightForeground#31273280
editorOverviewRuler.warningForeground#6630CB
editorOverviewRuler.wordHighlightForeground#6F677A
editorOverviewRuler.wordHighlightStrongForeground#87818E
editorOverviewRuler.wordHighlightTextForeground#A19BA2
editorRuler.foreground#6F677A
editorStickyScroll.background#1C121A
editorStickyScroll.border#39369A
editorStickyScrollHover.background#4A209F
editorSuggestWidget.background#1C121A
editorSuggestWidget.border#39369A
editorSuggestWidget.foreground#F6F2E7
editorSuggestWidget.highlightForeground#6163B9
editorSuggestWidget.selectedBackground#2A2678
editorSuggestWidget.selectedForeground#F6F2E7
editorSuggestWidgetStatus.foreground#C6C2BD
editorUnicodeHighlight.background#312732
editorUnicodeHighlight.border#6EBA58
editorWatermark.foreground#87818E
editorWhitespace.foreground#463D4A
editorWidget.background#312732
editorWidget.border#463D4A
editorWidget.foreground#C6C2BD
editorWidget.resizeBorder#87818E
errorForeground#A9D993
focusBorder#39369A
foreground#F6F2E7
git.blame.editorDecorationForeground#87818E
gitDecoration.addedResourceForeground#BF9EEC
gitDecoration.conflictingResourceForeground#88D9DD
gitDecoration.deletedResourceForeground#6EBA58
gitDecoration.ignoredResourceForeground#6F677A
gitDecoration.modifiedResourceForeground#F8F8C2
gitDecoration.stageDeletedResourceForeground#6EBA58
gitDecoration.stageModifiedResourceForeground#F8F8C2
gitDecoration.submoduleResourceForeground#6163B9
gitDecoration.untrackedResourceForeground#A9D993
icon.foreground#C6C2BD
input.background#1C121A
input.border#463D4A
input.foreground#C6C2BD
input.placeholderForeground#87818E
inputOption.activeBackground#2A2678
inputOption.activeBorder#1C121A
inputOption.activeForeground#F6F2E7
inputOption.hoverBackground#463D4A
list.activeSelectionBackground#2A2678
list.activeSelectionForeground#F6F2E7
list.deemphasizedForeground#87818E
list.dropBackground#2A2678
list.dropBetweenBackground#5A5262
list.errorForeground#EC979F
list.filterMatchBackground#D3BA34
list.filterMatchBorder#B59D30
list.focusAndSelectionOutline#39369A
list.focusBackground#322E89
list.focusForeground#C6C2BD
list.focusHighlightForeground#DE9A5A
list.focusOutline#39369A
list.highlightForeground#DE9A5A
list.hoverBackground#2A2678
list.hoverForeground#F6F2E7
list.inactiveFocusBackground#322E89
list.inactiveFocusOutline#39369A
list.inactiveSelectionBackground#322E89
list.inactiveSelectionForeground#F6F2E7
list.warningForeground#F2F0AA
listFilterWidget.background#9D1433
listFilterWidget.noMatchesOutline#6EBA58
listFilterWidget.outline#312732
menu.background#312732
menu.border#463D4A
menu.foreground#E2DDD2
menu.selectionBackground#A5A7D3
menu.selectionForeground#312732
menu.separatorBackground#463D4A
menubar.selectionBackground#322E89
menubar.selectionForeground#DFE0E8
merge.border#6163B9
merge.commonContentBackground#5a526280
merge.commonHeaderBackground#87818e80
merge.currentContentBackground#39369a80
merge.currentHeaderBackground#6163b980
merge.incomingContentBackground#ba682c80
merge.incomingHeaderBackground#de9a5a80
mergeEditor.change.background#2A2678
mergeEditor.change.word.background#322E89
mergeEditor.changeBase.background#312732
mergeEditor.changeBase.word.background#463D4A
mergeEditor.conflict.handled.minimapOverViewRuler#39369A
mergeEditor.conflict.handledFocused.border#6630CB
mergeEditor.conflict.handledUnfocused.border#5828B5
mergeEditor.conflict.input1.background#884217
mergeEditor.conflict.input2.background#A15522
mergeEditor.conflict.unhandled.minimapOverViewRuler#403EAB
mergeEditor.conflict.unhandledFocused.border#4CA839
mergeEditor.conflict.unhandledUnfocused.border#3E8F2E
mergeEditor.conflictingLines.background#312732
minimap.background#312732
minimap.errorHighlight#6EBA58
minimap.findMatchHighlight#87818e80
minimap.foregroundOpacity#f6f2e71a
minimap.infoHighlight#ECC494
minimap.selectionHighlight#de9a5a80
minimap.selectionOccurrenceHighlight#C6C2BD
minimap.warningHighlight#DECF58
notebook.cellBorderColor#463D4A
notebook.cellEditorBackground#1C121A
notebook.cellHoverBackground#312732
notebook.cellInsertionIndicator#5A5262
notebook.cellStatusBarItemHoverBackground#312732
notebook.cellToolbarSeparator#463D4A
notebook.editorBackground#1C121A
notebook.focusedCellBackground#312732
notebook.focusedCellBorder#463D4A
notebook.focusedEditorBorder#5A5262
notebook.inactiveFocusedCellBorder#312732
notebook.inactiveSelectedCellBorder#312732
notebook.outputContainerBackgroundColor#1C121A
notebook.outputContainerBorderColor#463D4A
notebook.selectedCellBackground#C6C2BD
notebook.selectedCellBorder#312732
notebookScrollbarSlider.activeBackground#312732
notebookScrollbarSlider.background#C6C2BD
notebookScrollbarSlider.hoverBackground#312732
notificationCenter.border#2A2678
notificationCenterHeader.background#1C121A
notificationCenterHeader.foreground#C6C2BD
notifications.background#231E67
notifications.border#1C121A
notifications.foreground#C6C2BD
notificationsErrorIcon.foreground#6EBA58
notificationsInfoIcon.foreground#403EAB
notificationsWarningIcon.foreground#DECF58
notificationToast.border#2A2678
outputView.background#1C121A
panel.background#1C121A
panel.border#39369A
panel.dropBorder#2A2678
panelSection.border#1C121A
panelSectionHeader.background#312732
panelSectionHeader.border#463D4A
panelSectionHeader.foreground#F6F2E7
panelStickyScroll.background#312732
panelStickyScroll.border#463D4A
panelTitle.activeBorder#39369A
panelTitle.activeForeground#F6F2E7
panelTitle.border#1C121A
panelTitle.inactiveForeground#C6C2BD
peekView.border#6163B9
peekViewEditor.background#231E67
peekViewEditor.matchHighlightBackground#DECF58
peekViewEditor.matchHighlightBorder#E6DF7B
peekViewEditorGutter.background#231E67
peekViewResult.background#231E67
peekViewResult.fileForeground#F6F2E7
peekViewResult.lineForeground#C6C2BD
peekViewResult.matchHighlightBackground#9D1433
peekViewResult.selectionBackground#2A2678
peekViewResult.selectionForeground#C6C2BD
peekViewTitle.background#1C121A
peekViewTitleDescription.foreground#C6C2BD
peekViewTitleLabel.foreground#F6F2E7
pickerGroup.border#463D4A
pickerGroup.foreground#6163B9
problemsErrorIcon.foreground#6EBA58
problemsInfoIcon.foreground#DE9A5A
problemsWarningIcon.foreground#8756D8
progressBar.background#6163B9
quickInput.background#1C121A
quickInput.foreground#F6F2E7
quickInputList.focusBackground#312732
quickInputList.focusForeground#F6F2E7
quickInputList.focusIconForeground#87818E
quickInputTitle.background#312732
sash.hoverBorder#8756D8
scrollbarSlider.activeBackground#403EAB
scrollbarSlider.background#39369A
scrollbarSlider.hoverBackground#39369A
search.resultsInfoForeground#C6C2BD
searchEditor.findMatchBackground#322E89
searchEditor.findMatchBorder#39369A
searchEditor.textInputBorder#403EAB
selection.background#39369A
settings.focusedRowBackground#1C121A
settings.headerBorder#312732
settings.headerForeground#C6C2BD
settings.sashBorder#463D4A
sideBar.background#312732
sideBar.border#463D4A
sideBar.dropBackground#312732
sideBar.foreground#F6F2E7
sideBarSectionHeader.background#463D4A
sideBarSectionHeader.border#5A5262
sideBarSectionHeader.foreground#C6C2BD
sideBarStickyScroll.background#463D4A
sideBarStickyScroll.border#6F677A
sideBarTitle.background#463D4A
sideBarTitle.border#5A5262
sideBarTitle.foreground#F6F2E7
sideBySideEditor.horizontalBorder#A19BA2
sideBySideEditor.verticalBorder#C6C2BD
statusBar.background#322E89
statusBar.border#5A5262
statusBar.debuggingBackground#91CC79
statusBar.debuggingForeground#1C121A
statusBar.foreground#F6F2E7
statusBar.noFolderBackground#6163B9
statusBar.noFolderBorder#5A5262
statusBar.noFolderForeground#1C121A
statusBarItem.activeBackground#1C121A
statusBarItem.hoverBackground#5828B5
statusBarItem.remoteBackground#5828B5
statusBarItem.remoteForeground#F6F2E7
tab.activeBackground#322E89
tab.border#5A5262
tab.hoverBackground#2A2678
tab.hoverForeground#F6F2E7
tab.inactiveBackground#312732
tab.inactiveForeground#5A5262
tab.selectedBackground#1C121A
tab.selectedForeground#F6F2E7
tab.unfocusedActiveBackground#322E89
tab.unfocusedActiveForeground#A19BA2
tab.unfocusedHoverBackground#312732
tab.unfocusedHoverForeground#C6C2BD
tab.unfocusedInactiveBackground#312732
tab.unfocusedInactiveForeground#6F677A
terminal.ansiBlack#F6F2E7
terminal.ansiBlue#A5A7D3
terminal.ansiBrightBlack#C6C2BD
terminal.ansiBrightBlue#6163B9
terminal.ansiBrightCyan#3DB8C8
terminal.ansiBrightGreen#6EBA58
terminal.ansiBrightMagenta#8756D8
terminal.ansiBrightRed#DE5066
terminal.ansiBrightWhite#1C121A
terminal.ansiBrightYellow#DECF58
terminal.ansiCyan#88D9DD
terminal.ansiGreen#A9D993
terminal.ansiMagenta#BF9EEC
terminal.ansiRed#EC979F
terminal.ansiWhite#463D4A
terminal.ansiYellow#ECE793
terminal.background#1C121A
terminal.border#1C121A
terminal.dropBackground#2A2678
terminal.foreground#F6F2E7
terminal.inactiveSelectionBackground#312732
terminal.selectionBackground#5A5262
terminalCommandDecoration.defaultBackground#312732
terminalCommandDecoration.errorBackground#3E8F2E
terminalCommandDecoration.successBackground#5828B5
terminalCursor.background#6163B9
terminalCursor.foreground#1C121A
terminalOverviewRuler.border#463D4A
terminalOverviewRuler.cursorForeground#2F7623
terminalOverviewRuler.findMatchForeground#98812C
terminalStickyScroll.background#1C121A
terminalStickyScroll.border#463D4A
terminalStickyScrollHover.background#312732
testing.iconErrored#6EBA58
testing.iconFailed#4CA839
testing.iconPassed#8756D8
testing.iconQueued#D3BA34
testing.iconSkipped#D37B36
testing.iconUnset#5A5262
testing.message.error.lineBackground#215D18
testing.message.info.decorationForeground#F6F2E7
testing.message.info.lineBackground#884217
testing.peekBorder#463D4A
testing.peekHeaderBackground#312732
testing.runAction#39369A
textLink.activeForeground#8756D8
textLink.foreground#6163B9
titleBar.activeBackground#312732
titleBar.activeForeground#E2DDD2
titleBar.border#5A5262
titleBar.inactiveBackground#463D4A
titleBar.inactiveForeground#F6F2E7
tree.inactiveIndentGuidesStroke#87818e66
tree.indentGuidesStroke#87818E
tree.tableColumnsBorder#5a526220
tree.tableOddRowsBackground#5a52620a
walkThrough.embeddedEditorBackground#463D4A
walkthrough.stepTitle.foreground#F6F2E7
welcomePage.background#1C121A
welcomePage.progress.background#2A2678
welcomePage.progress.foreground#463D4A
welcomePage.tileBackground#312732
welcomePage.tileBorder#463D4A
welcomePage.tileHoverBackground#2A2678
widget.border#87818E
window.activeBorder#39369A
window.inactiveBorder#C6C2BD

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment, comment.line, comment.block, comment.block.documentation, punctuation.definition.comment, meta.toc-list	#5A5262	italic
constant, constant.numeric, constant.numeric.integer, constant.numeric.integer.binary, constant.numeric.integer.octal, constant.numeric.integer.decimal, constant.numeric.integer.hexadecimal, constant.numeric.integer.other, constant.numeric.float, constant.numeric.float.binary, constant.numeric.float.octal, constant.numeric.float.decimal, constant.numeric.float.hexadecimal, constant.numeric.float.other, constant.numeric.complex, constant.numeric.complex.real, constant.numeric.complex.imaginary, constant.language, constant.character.escape, constant.other.placeholder, constant.other	#88D9DD
entity.name.class, entity.name.struct, entity.name.enum, entity.name.union, entity.name.trait, entity.name.interface, entity.name.impl, entity.name.type, entity.name.class.ford-decl, entity.other.inherited-class, entity.name.function.constructor, entity.name.function.destructor, entity.name.namespace, entity.name.constant, entity.name.label, entity.name.tag, entity.name.section, entity.other.attribute-name	#A5A7D3	bold
entity.name.function, entity.name.function.constructor, entity.name.function.destructor	#BF9EEC	bold italic
keyword, keyword.control, keyword.control.conditional, keyword.control.import, punctuation.definition.keyword, keyword.operator, keyword.operator.assignment, keyword.operator.arithmetic, keyword.operator.bitwise, keyword.operator.logical, keyword.operator.word, keyword.other	#ECC494
markup.heading, markup.list.numbered, markup.list.unnumbered, markup.bold, markup.italic, markup.underline, markup.inserted, markup.deleted, markup.underline.link, markup.quote, markup.raw.inline, markup.raw.block, markup.other	#F6F2E7
markup.underline	—	underline
markup.bold	#ECC494	bold
markup.heading	#A9D993	bold
markup.italic	—	italic
markup.inserted	#BF9EEC	—
markup.deleted	#A9D993	—
markup.changed	#ECC494	—
markup.inline.raw	#A9D993	—
punctuation.definition.tag	#A9D993	—
meta.class, meta.struct, meta.enum, meta.union, meta.trait, meta.interface, meta.impl, meta.type, meta.function, meta.function.parameters, meta.function.return-type, meta.namespace, meta.preprocessor, meta.annotation, meta.annotation.identifier, meta.annotation.parameters, meta.path, meta.function-call, meta.block, meta.braces, meta.group, meta.parens, meta.brackets, meta.generic, meta.tag, meta.paragraph	#C6C2BD
storage, storage.type, storage.modifier, storage.type.function, storage.type.class, storage.type.struct, storage.type.enum, storage.type.union, storage.type.trait, storage.type.interface, storage.type.impl, storage.type keyword.declaration.type	#ECC494
string, string.quoted, string.quoted.single, string.quoted.double, string.quoted.triple, string.quoted.other, meta.string, punctuation.definition.string.begin, punctuation.definition.string.end, string.quoted.unquoted, string.quoted.regexp, meta.interpolated, punctuation.section.interpolation.begin, punctuation.section.interpolation.end, source.language-suffix.embedded	#A9D993
support, support.class, support.constant, support.function, support.other, support.property-value, support.type, support.variable, support.module	#F6F2E7	bold
support.class, support.function, support.module	#A5A7D3	bold
support.constant, support.other, support.property-value, support.type, support.variable	#A5A7D3
variable, variable.other, variable.other.readwrite, punctuation.definition.variable, variable.other.constant, variable.language, variable.parameter, variable.other.member, variable.function, variable.annotation, punctuation.definition.annotation	#F6F2E7
variable.language	#F6F2E7	italic
variable.other, variable.other.member	#BF9EEC
variable.parameter	#A9D993
	#F6F2E7
punctuation.separator, punctuation.terminator, punctuation.separator.continuation, punctuation.accessor	#C6C2BD
source	#C6C2BD
text.html, text.xml	#C6C2BD
invalid, invalid.illegal, invalid.deprecated	#A9D993	underline
punctuation.definition.tag, punctuation.definition.annotation, punctuation.section.block.begin, punctuation.section.block.end, punctuation.section.braces.begin, punctuation.section.braces.end, punctuation.section.group.begin, punctuation.section.group.end, punctuation.section.parens.begin, punctuation.section.parens.end, punctuation.section.brackets.begin, punctuation.section.brackets.end, punctuation.definition.generic.begin, punctuation.definition.generic.end	#A9D993	—

VS Code preview

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

Chicha — Chicha Light

fetchUser.ts

index.ts

README.md

srccomponentsfetchUser.tsfetchUser

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
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}!`;
}

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

Light+

colors

Workbench UI color keys from the theme JSON colors map.

activityBar.activeBorder#39369A
activityBar.background#E2DDD2
activityBar.border#C6C2BD
activityBar.dropBorder#403EAB
activityBar.foreground#403EAB
activityBar.inactiveForeground#463D4A
activityBarBadge.background#39369A
activityBarBadge.foreground#F6F2E7
badge.background#39369A
badge.foreground#F6F2E7
breadcrumb.activeSelectionForeground#C6C2BD
breadcrumb.background#E2DDD2
breadcrumb.focusForeground#5A5262
breadcrumb.foreground#312732
breadcrumbPicker.background#E2DDD2
button.background#403EAB
button.border#C6C2BD
button.foreground#F6F2E7
button.hoverBackground#322E89
button.secondaryBackground#6F677A
button.secondaryForeground#F6F2E7
button.secondaryHoverBackground#463D4A
button.separator#A19BA2
chat.requestBackground#E2DDD2
chat.requestBorder#A19BA2
checkbox.background#F6F2E7
checkbox.border#F6F2E7
checkbox.foreground#463D4A
debugConsole.errorForeground#4CA839
debugConsole.infoForeground#1C121A
debugConsole.sourceForeground#463D4A
debugConsole.warningForeground#D3BA34
debugConsoleInputIcon.foreground#6F677A
debugExceptionWidget.background#DFE0E8
debugExceptionWidget.border#C2C4DE
debugIcon.breakpointForeground#6EBA58
debugIcon.continueForeground#5828B5
debugIcon.pauseForeground#8689C8
debugIcon.restartForeground#8756D8
debugIcon.startForeground#6630CB
debugIcon.stopForeground#4CA839
debugTokenExpression.boolean#5A5262
debugTokenExpression.error#4CA839
debugTokenExpression.name#1C121A
debugTokenExpression.number#6F677A
debugTokenExpression.string#312732
debugTokenExpression.value#463D4A
debugToolBar.background#DFE0E8
debugToolBar.border#C2C4DE
debugView.valueChangedHighlight#ECE793
descriptionForeground#6F677A
diffEditor.border#8689C8
diffEditor.insertedTextBackground#a980e580
diffEditor.removedTextBackground#e67b8780
diffEditorOverview.insertedForeground#A980E5
diffEditorOverview.removedForeground#91CC79
disabledForeground#87818E
dropdown.background#F6F2E7
dropdown.border#8689C8
dropdown.foreground#463D4A
editor.background#F6F2E7
editor.findMatchBackground#BF9EEC
editor.findMatchBorder#6630CB
editor.findMatchForeground#463D4A
editor.findMatchHighlightBackground#8756d880
editor.findMatchHighlightBorder#CF2648
editor.findRangeHighlightBackground#87818e80
editor.findRangeHighlightBorder#e2ddd280
editor.focusedStackFrameHighlightBackground#A5A7D3
editor.foldBackground#c2c4de80
editor.foldPlaceholderForeground#C6C2BD
editor.foreground#1C121A
editor.hoverHighlightBackground#ecc49480
editor.inactiveSelectionBackground#8689c859
editor.lineHighlightBackground#DFE0E8
editor.lineHighlightBorder#C2C4DE
editor.linkedEditingBackground#C6C2BD
editor.rangeHighlightBackground#e2ddd280
editor.rangeHighlightBorder#E2DDD2
editor.selectionBackground#a980e559
editor.selectionHighlightBackground#8689c859
editor.selectionHighlightBorder#6630CB
editor.stackFrameHighlightBackground#C2C4DE
editor.wordHighlightBackground#ecc49480
editor.wordHighlightBorder#C6C2BD
editor.wordHighlightStrongBackground#a5a7d380
editor.wordHighlightStrongBorder#87818E
editorCodeLens.foreground#6F677A
editorCommentsWidget.rangeActiveBackground#E2DDD2
editorCommentsWidget.rangeBackground#C6C2BD
editorCommentsWidget.replyInputBackground#E2DDD2
editorCommentsWidget.resolvedBorder#A19BA2
editorCommentsWidget.unresolvedBorder#87818E
editorCursor.background#E2DDD2
editorCursor.foreground#1C121A
editorGhostText.background#F6F2E7
editorGhostText.border#C6C2BD
editorGhostText.foreground#1C121A
editorGroup.border#F6F2E7
editorGroup.dropBackground#C2C4DE
editorGroup.dropIntoPromptBackground#A19BA2
editorGroup.dropIntoPromptBorder#87818E
editorGroup.dropIntoPromptForeground#1C121A
editorGroup.emptyBackground#F6F2E7
editorGroup.focusedEmptyBorder#6F677A
editorGroupHeader.border#87818E
editorGroupHeader.tabsBackground#E2DDD2
editorGroupHeader.tabsBorder#A19BA2
editorGutter.addedBackground#6630CB
editorGutter.background#e2ddd240
editorGutter.commentGlyphForeground#6F677A
editorGutter.commentRangeForeground#C2C4DE
editorGutter.commentUnresolvedGlyphForeground#5A5262
editorGutter.deletedBackground#2F7623
editorGutter.foldingControlForeground#1C121A
editorGutter.modifiedBackground#403EAB
editorHoverWidget.background#F6F2E7
editorHoverWidget.border#8689C8
editorHoverWidget.foreground#1C121A
editorHoverWidget.highlightForeground#6630CB
editorHoverWidget.statusBarBackground#E2DDD2
editorIndentGuide.activeBackground1#8689C8
editorIndentGuide.background1#C6C2BD
editorInlayHint.background#F6F2E7
editorInlayHint.foreground#A19BA2
editorLightBulb.foreground#D3BA34
editorLightBulbAi.foreground#D37B36
editorLightBulbAutoFix.foreground#6630CB
editorLineNumber.activeForeground#1C121A
editorLineNumber.foreground#87818E
editorLink.activeForeground#322E89
editorMarkerNavigation.background#F6F2E7
editorMarkerNavigationError.background#4CA839
editorMarkerNavigationInfo.background#6163B9
editorMarkerNavigationWarning.background#D3BA34
editorOverviewRuler.addedForeground#A980E5
editorOverviewRuler.background#E2DDD2
editorOverviewRuler.border#A19BA2
editorOverviewRuler.bracketMatchForeground#A19BA2
editorOverviewRuler.commonContentForeground#403EAB
editorOverviewRuler.currentContentForeground#D37B36
editorOverviewRuler.deletedForeground#91CC79
editorOverviewRuler.errorForeground#4CA839
editorOverviewRuler.findMatchForeground#a980e580
editorOverviewRuler.incomingContentForeground#6163B9
editorOverviewRuler.infoForeground#DE9A5A
editorOverviewRuler.inlineChatRemoved#91CC79
editorOverviewRuler.modifiedForeground#E6B47D
editorOverviewRuler.rangeHighlightForeground#C6C2BD
editorOverviewRuler.selectionHighlightForeground#e2ddd280
editorOverviewRuler.warningForeground#8756D8
editorOverviewRuler.wordHighlightForeground#87818E
editorOverviewRuler.wordHighlightStrongForeground#6F677A
editorOverviewRuler.wordHighlightTextForeground#5A5262
editorRuler.foreground#87818E
editorStickyScroll.background#F6F2E7
editorStickyScroll.border#8689C8
editorStickyScrollHover.background#BF9EEC
editorSuggestWidget.background#F6F2E7
editorSuggestWidget.border#8689C8
editorSuggestWidget.foreground#1C121A
editorSuggestWidget.highlightForeground#403EAB
editorSuggestWidget.selectedBackground#C2C4DE
editorSuggestWidget.selectedForeground#1C121A
editorSuggestWidgetStatus.foreground#463D4A
editorUnicodeHighlight.background#E2DDD2
editorUnicodeHighlight.border#4CA839
editorWatermark.foreground#6F677A
editorWhitespace.foreground#C6C2BD
editorWidget.background#E2DDD2
editorWidget.border#C6C2BD
editorWidget.foreground#463D4A
editorWidget.resizeBorder#6F677A
errorForeground#2F7623
focusBorder#8689C8
foreground#1C121A
git.blame.editorDecorationForeground#6F677A
gitDecoration.addedResourceForeground#4A209F
gitDecoration.conflictingResourceForeground#0F7186
gitDecoration.deletedResourceForeground#4CA839
gitDecoration.ignoredResourceForeground#87818E
gitDecoration.modifiedResourceForeground#5C4724
gitDecoration.stageDeletedResourceForeground#4CA839
gitDecoration.stageModifiedResourceForeground#5C4724
gitDecoration.submoduleResourceForeground#403EAB
gitDecoration.untrackedResourceForeground#2F7623
icon.foreground#463D4A
input.background#F6F2E7
input.border#C6C2BD
input.foreground#463D4A
input.placeholderForeground#6F677A
inputOption.activeBackground#C2C4DE
inputOption.activeBorder#F6F2E7
inputOption.activeForeground#1C121A
inputOption.hoverBackground#C6C2BD
list.activeSelectionBackground#C2C4DE
list.activeSelectionForeground#1C121A
list.deemphasizedForeground#6F677A
list.dropBackground#C2C4DE
list.dropBetweenBackground#A19BA2
list.errorForeground#9D1433
list.filterMatchBackground#DECF58
list.filterMatchBorder#E6DF7B
list.focusAndSelectionOutline#8689C8
list.focusBackground#A5A7D3
list.focusForeground#463D4A
list.focusHighlightForeground#D37B36
list.focusOutline#8689C8
list.highlightForeground#D37B36
list.hoverBackground#C2C4DE
list.hoverForeground#1C121A
list.inactiveFocusBackground#A5A7D3
list.inactiveFocusOutline#8689C8
list.inactiveSelectionBackground#A5A7D3
list.inactiveSelectionForeground#1C121A
list.warningForeground#7A6428
listFilterWidget.background#EC979F
listFilterWidget.noMatchesOutline#4CA839
listFilterWidget.outline#E2DDD2
menu.background#E2DDD2
menu.border#C6C2BD
menu.foreground#312732
menu.selectionBackground#322E89
menu.selectionForeground#E2DDD2
menu.separatorBackground#C6C2BD
menubar.selectionBackground#A5A7D3
menubar.selectionForeground#231E67
merge.border#403EAB
merge.commonContentBackground#a19ba280
merge.commonHeaderBackground#6f677a80
merge.currentContentBackground#8689c880
merge.currentHeaderBackground#403eab80
merge.incomingContentBackground#e6b47d80
merge.incomingHeaderBackground#d37b3680
mergeEditor.change.background#C2C4DE
mergeEditor.change.word.background#A5A7D3
mergeEditor.changeBase.background#E2DDD2
mergeEditor.changeBase.word.background#C6C2BD
mergeEditor.conflict.handled.minimapOverViewRuler#8689C8
mergeEditor.conflict.handledFocused.border#8756D8
mergeEditor.conflict.handledUnfocused.border#A980E5
mergeEditor.conflict.input1.background#F2D5AC
mergeEditor.conflict.input2.background#ECC494
mergeEditor.conflict.unhandled.minimapOverViewRuler#6163B9
mergeEditor.conflict.unhandledFocused.border#6EBA58
mergeEditor.conflict.unhandledUnfocused.border#91CC79
mergeEditor.conflictingLines.background#E2DDD2
minimap.background#E2DDD2
minimap.errorHighlight#4CA839
minimap.findMatchHighlight#6f677a80
minimap.foregroundOpacity#1c121a1a
minimap.infoHighlight#A15522
minimap.selectionHighlight#d37b3680
minimap.selectionOccurrenceHighlight#463D4A
minimap.warningHighlight#D3BA34
notebook.cellBorderColor#C6C2BD
notebook.cellEditorBackground#F6F2E7
notebook.cellHoverBackground#E2DDD2
notebook.cellInsertionIndicator#A19BA2
notebook.cellStatusBarItemHoverBackground#E2DDD2
notebook.cellToolbarSeparator#C6C2BD
notebook.editorBackground#F6F2E7
notebook.focusedCellBackground#E2DDD2
notebook.focusedCellBorder#C6C2BD
notebook.focusedEditorBorder#A19BA2
notebook.inactiveFocusedCellBorder#E2DDD2
notebook.inactiveSelectedCellBorder#E2DDD2
notebook.outputContainerBackgroundColor#F6F2E7
notebook.outputContainerBorderColor#C6C2BD
notebook.selectedCellBackground#463D4A
notebook.selectedCellBorder#E2DDD2
notebookScrollbarSlider.activeBackground#E2DDD2
notebookScrollbarSlider.background#463D4A
notebookScrollbarSlider.hoverBackground#E2DDD2
notificationCenter.border#C2C4DE
notificationCenterHeader.background#F6F2E7
notificationCenterHeader.foreground#463D4A
notifications.background#DFE0E8
notifications.border#F6F2E7
notifications.foreground#463D4A
notificationsErrorIcon.foreground#4CA839
notificationsInfoIcon.foreground#6163B9
notificationsWarningIcon.foreground#D3BA34
notificationToast.border#C2C4DE
outputView.background#F6F2E7
panel.background#F6F2E7
panel.border#8689C8
panel.dropBorder#C2C4DE
panelSection.border#F6F2E7
panelSectionHeader.background#E2DDD2
panelSectionHeader.border#C6C2BD
panelSectionHeader.foreground#1C121A
panelStickyScroll.background#E2DDD2
panelStickyScroll.border#C6C2BD
panelTitle.activeBorder#8689C8
panelTitle.activeForeground#1C121A
panelTitle.border#F6F2E7
panelTitle.inactiveForeground#463D4A
peekView.border#403EAB
peekViewEditor.background#DFE0E8
peekViewEditor.matchHighlightBackground#D3BA34
peekViewEditor.matchHighlightBorder#B59D30
peekViewEditorGutter.background#DFE0E8
peekViewResult.background#DFE0E8
peekViewResult.fileForeground#1C121A
peekViewResult.lineForeground#463D4A
peekViewResult.matchHighlightBackground#EC979F
peekViewResult.selectionBackground#C2C4DE
peekViewResult.selectionForeground#463D4A
peekViewTitle.background#F6F2E7
peekViewTitleDescription.foreground#463D4A
peekViewTitleLabel.foreground#1C121A
pickerGroup.border#C6C2BD
pickerGroup.foreground#403EAB
problemsErrorIcon.foreground#4CA839
problemsInfoIcon.foreground#D37B36
problemsWarningIcon.foreground#6630CB
progressBar.background#403EAB
quickInput.background#F6F2E7
quickInput.foreground#1C121A
quickInputList.focusBackground#E2DDD2
quickInputList.focusForeground#1C121A
quickInputList.focusIconForeground#6F677A
quickInputTitle.background#E2DDD2
sash.hoverBorder#6630CB
scrollbarSlider.activeBackground#6163B9
scrollbarSlider.background#8689C8
scrollbarSlider.hoverBackground#8689C8
search.resultsInfoForeground#463D4A
searchEditor.findMatchBackground#A5A7D3
searchEditor.findMatchBorder#8689C8
searchEditor.textInputBorder#6163B9
selection.background#8689C8
settings.focusedRowBackground#F6F2E7
settings.headerBorder#E2DDD2
settings.headerForeground#463D4A
settings.sashBorder#C6C2BD
sideBar.background#E2DDD2
sideBar.border#C6C2BD
sideBar.dropBackground#E2DDD2
sideBar.foreground#1C121A
sideBarSectionHeader.background#C6C2BD
sideBarSectionHeader.border#A19BA2
sideBarSectionHeader.foreground#463D4A
sideBarStickyScroll.background#C6C2BD
sideBarStickyScroll.border#87818E
sideBarTitle.background#C6C2BD
sideBarTitle.border#A19BA2
sideBarTitle.foreground#1C121A
sideBySideEditor.horizontalBorder#5A5262
sideBySideEditor.verticalBorder#463D4A
statusBar.background#A5A7D3
statusBar.border#A19BA2
statusBar.debuggingBackground#3E8F2E
statusBar.debuggingForeground#F6F2E7
statusBar.foreground#1C121A
statusBar.noFolderBackground#403EAB
statusBar.noFolderBorder#A19BA2
statusBar.noFolderForeground#F6F2E7
statusBarItem.activeBackground#F6F2E7
statusBarItem.hoverBackground#A980E5
statusBarItem.remoteBackground#A980E5
statusBarItem.remoteForeground#1C121A
tab.activeBackground#A5A7D3
tab.border#A19BA2
tab.hoverBackground#C2C4DE
tab.hoverForeground#1C121A
tab.inactiveBackground#E2DDD2
tab.inactiveForeground#A19BA2
tab.selectedBackground#F6F2E7
tab.selectedForeground#1C121A
tab.unfocusedActiveBackground#A5A7D3
tab.unfocusedActiveForeground#5A5262
tab.unfocusedHoverBackground#E2DDD2
tab.unfocusedHoverForeground#463D4A
tab.unfocusedInactiveBackground#E2DDD2
tab.unfocusedInactiveForeground#87818E
terminal.ansiBlack#1C121A
terminal.ansiBlue#322E89
terminal.ansiBrightBlack#463D4A
terminal.ansiBrightBlue#403EAB
terminal.ansiBrightCyan#1AA6BF
terminal.ansiBrightGreen#4CA839
terminal.ansiBrightMagenta#6630CB
terminal.ansiBrightRed#CF2648
terminal.ansiBrightWhite#F6F2E7
terminal.ansiBrightYellow#D3BA34
terminal.ansiCyan#0F7186
terminal.ansiGreen#2F7623
terminal.ansiMagenta#4A209F
terminal.ansiRed#9D1433
terminal.ansiWhite#C6C2BD
terminal.ansiYellow#98812C
terminal.background#F6F2E7
terminal.border#F6F2E7
terminal.dropBackground#C2C4DE
terminal.foreground#1C121A
terminal.inactiveSelectionBackground#E2DDD2
terminal.selectionBackground#A19BA2
terminalCommandDecoration.defaultBackground#E2DDD2
terminalCommandDecoration.errorBackground#91CC79
terminalCommandDecoration.successBackground#A980E5
terminalCursor.background#403EAB
terminalCursor.foreground#F6F2E7
terminalOverviewRuler.border#C6C2BD
terminalOverviewRuler.cursorForeground#A9D993
terminalOverviewRuler.findMatchForeground#ECE793
terminalStickyScroll.background#F6F2E7
terminalStickyScroll.border#C6C2BD
terminalStickyScrollHover.background#E2DDD2
testing.iconErrored#4CA839
testing.iconFailed#6EBA58
testing.iconPassed#6630CB
testing.iconQueued#DECF58
testing.iconSkipped#DE9A5A
testing.iconUnset#A19BA2
testing.message.error.lineBackground#C1E5AC
testing.message.info.decorationForeground#1C121A
testing.message.info.lineBackground#F2D5AC
testing.peekBorder#C6C2BD
testing.peekHeaderBackground#E2DDD2
testing.runAction#8689C8
textLink.activeForeground#6630CB
textLink.foreground#403EAB
titleBar.activeBackground#E2DDD2
titleBar.activeForeground#312732
titleBar.border#A19BA2
titleBar.inactiveBackground#C6C2BD
titleBar.inactiveForeground#1C121A
tree.inactiveIndentGuidesStroke#6f677a66
tree.indentGuidesStroke#6F677A
tree.tableColumnsBorder#a19ba220
tree.tableOddRowsBackground#a19ba20a
walkThrough.embeddedEditorBackground#C6C2BD
walkthrough.stepTitle.foreground#1C121A
welcomePage.background#F6F2E7
welcomePage.progress.background#C2C4DE
welcomePage.progress.foreground#C6C2BD
welcomePage.tileBackground#E2DDD2
welcomePage.tileBorder#C6C2BD
welcomePage.tileHoverBackground#C2C4DE
widget.border#6F677A
window.activeBorder#8689C8
window.inactiveBorder#463D4A

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment, comment.line, comment.block, comment.block.documentation, punctuation.definition.comment, meta.toc-list	#A19BA2	italic
constant, constant.numeric, constant.numeric.integer, constant.numeric.integer.binary, constant.numeric.integer.octal, constant.numeric.integer.decimal, constant.numeric.integer.hexadecimal, constant.numeric.integer.other, constant.numeric.float, constant.numeric.float.binary, constant.numeric.float.octal, constant.numeric.float.decimal, constant.numeric.float.hexadecimal, constant.numeric.float.other, constant.numeric.complex, constant.numeric.complex.real, constant.numeric.complex.imaginary, constant.language, constant.character.escape, constant.other.placeholder, constant.other	#0F7186
entity.name.class, entity.name.struct, entity.name.enum, entity.name.union, entity.name.trait, entity.name.interface, entity.name.impl, entity.name.type, entity.name.class.ford-decl, entity.other.inherited-class, entity.name.function.constructor, entity.name.function.destructor, entity.name.namespace, entity.name.constant, entity.name.label, entity.name.tag, entity.name.section, entity.other.attribute-name	#322E89	bold
entity.name.function, entity.name.function.constructor, entity.name.function.destructor	#4A209F	bold italic
keyword, keyword.control, keyword.control.conditional, keyword.control.import, punctuation.definition.keyword, keyword.operator, keyword.operator.assignment, keyword.operator.arithmetic, keyword.operator.bitwise, keyword.operator.logical, keyword.operator.word, keyword.other	#A15522
markup.heading, markup.list.numbered, markup.list.unnumbered, markup.bold, markup.italic, markup.underline, markup.inserted, markup.deleted, markup.underline.link, markup.quote, markup.raw.inline, markup.raw.block, markup.other	#1C121A
markup.underline	—	underline
markup.bold	#A15522	bold
markup.heading	#2F7623	bold
markup.italic	—	italic
markup.inserted	#4A209F	—
markup.deleted	#2F7623	—
markup.changed	#A15522	—
markup.inline.raw	#2F7623	—
punctuation.definition.tag	#2F7623	—
meta.class, meta.struct, meta.enum, meta.union, meta.trait, meta.interface, meta.impl, meta.type, meta.function, meta.function.parameters, meta.function.return-type, meta.namespace, meta.preprocessor, meta.annotation, meta.annotation.identifier, meta.annotation.parameters, meta.path, meta.function-call, meta.block, meta.braces, meta.group, meta.parens, meta.brackets, meta.generic, meta.tag, meta.paragraph	#463D4A
storage, storage.type, storage.modifier, storage.type.function, storage.type.class, storage.type.struct, storage.type.enum, storage.type.union, storage.type.trait, storage.type.interface, storage.type.impl, storage.type keyword.declaration.type	#A15522
string, string.quoted, string.quoted.single, string.quoted.double, string.quoted.triple, string.quoted.other, meta.string, punctuation.definition.string.begin, punctuation.definition.string.end, string.quoted.unquoted, string.quoted.regexp, meta.interpolated, punctuation.section.interpolation.begin, punctuation.section.interpolation.end, source.language-suffix.embedded	#2F7623
support, support.class, support.constant, support.function, support.other, support.property-value, support.type, support.variable, support.module	#1C121A	bold
support.class, support.function, support.module	#322E89	bold
support.constant, support.other, support.property-value, support.type, support.variable	#322E89
variable, variable.other, variable.other.readwrite, punctuation.definition.variable, variable.other.constant, variable.language, variable.parameter, variable.other.member, variable.function, variable.annotation, punctuation.definition.annotation	#1C121A
variable.language	#1C121A	italic
variable.other, variable.other.member	#4A209F
variable.parameter	#2F7623
	#1C121A
punctuation.separator, punctuation.terminator, punctuation.separator.continuation, punctuation.accessor	#463D4A
source	#463D4A
text.html, text.xml	#463D4A
invalid, invalid.illegal, invalid.deprecated	#2F7623	underline
punctuation.definition.tag, punctuation.definition.annotation, punctuation.section.block.begin, punctuation.section.block.end, punctuation.section.braces.begin, punctuation.section.braces.end, punctuation.section.group.begin, punctuation.section.group.end, punctuation.section.parens.begin, punctuation.section.parens.end, punctuation.section.brackets.begin, punctuation.section.brackets.end, punctuation.definition.generic.begin, punctuation.definition.generic.end	#2F7623	—

VS Code preview

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

Chicha — Chicha Soft

fetchUser.ts

index.ts

README.md

srccomponentsfetchUser.tsfetchUser

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
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}!`;
}

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

Light+

colors

Workbench UI color keys from the theme JSON colors map.

activityBar.activeBorder#5d45be
activityBar.background#f6f5f1
activityBar.border#dedcd8
activityBar.dropBorder#6d59c3
activityBar.foreground#6d59c3
activityBar.inactiveForeground#635466
activityBarBadge.background#5d45be
activityBarBadge.foreground#ffffff
badge.background#5d45be
badge.foreground#ffffff
breadcrumb.activeSelectionForeground#dedcd8
breadcrumb.background#f6f5f1
breadcrumb.focusForeground#77697e
breadcrumb.foreground#4f3d4d
breadcrumbPicker.background#f6f5f1
button.background#6d59c3
button.border#dedcd8
button.foreground#ffffff
button.hoverBackground#533baf
button.secondaryBackground#8c8094
button.secondaryForeground#ffffff
button.secondaryHoverBackground#635466
button.separator#bbb5ba
chat.requestBackground#f6f5f1
chat.requestBorder#bbb5ba
checkbox.background#ffffff
checkbox.border#ffffff
checkbox.foreground#635466
debugConsole.errorForeground#51c450
debugConsole.infoForeground#3b2633
debugConsole.sourceForeground#635466
debugConsole.warningForeground#dbdc5e
debugConsoleInputIcon.foreground#8c8094
debugExceptionWidget.background#fdfdfd
debugExceptionWidget.border#e4e3f0
debugIcon.breakpointForeground#81c97c
debugIcon.continueForeground#893cd4
debugIcon.pauseForeground#afa9d8
debugIcon.restartForeground#b57fe2
debugIcon.startForeground#9957d7
debugIcon.stopForeground#51c450
debugTokenExpression.boolean#77697e
debugTokenExpression.error#51c450
debugTokenExpression.name#3b2633
debugTokenExpression.number#8c8094
debugTokenExpression.string#4f3d4d
debugTokenExpression.value#635466
debugToolBar.background#fdfdfd
debugToolBar.border#e4e3f0
debugView.valueChangedHighlight#eef4be
descriptionForeground#8c8094
diffEditor.border#afa9d8
diffEditor.insertedTextBackground#d1aaee80
diffEditor.removedTextBackground#eeaaa680
diffEditorOverview.insertedForeground#d1aaee
diffEditorOverview.removedForeground#a5da9e
disabledForeground#a29ca6
dropdown.background#ffffff
dropdown.border#afa9d8
dropdown.foreground#635466
editor.background#ffffff
editor.findMatchBackground#e2c9f4
editor.findMatchBorder#9957d7
editor.findMatchForeground#635466
editor.findMatchHighlightBackground#b57fe280
editor.findMatchHighlightBorder#de4a4f
editor.findRangeHighlightBackground#a29ca680
editor.findRangeHighlightBorder#f6f5f180
editor.focusedStackFrameHighlightBackground#cbc7e4
editor.foldBackground#e4e3f080
editor.foldPlaceholderForeground#dedcd8
editor.foreground#3b2633
editor.hoverHighlightBackground#f4e5bf80
editor.inactiveSelectionBackground#afa9d859
editor.lineHighlightBackground#fdfdfd
editor.lineHighlightBorder#e4e3f0
editor.linkedEditingBackground#dedcd8
editor.rangeHighlightBackground#f6f5f180
editor.rangeHighlightBorder#f6f5f1
editor.selectionBackground#d1aaee59
editor.selectionHighlightBackground#afa9d859
editor.selectionHighlightBorder#9957d7
editor.stackFrameHighlightBackground#e4e3f0
editor.wordHighlightBackground#f4e5bf80
editor.wordHighlightBorder#dedcd8
editor.wordHighlightStrongBackground#cbc7e480
editor.wordHighlightStrongBorder#a29ca6
editorCodeLens.foreground#8c8094
editorCommentsWidget.rangeActiveBackground#f6f5f1
editorCommentsWidget.rangeBackground#dedcd8
editorCommentsWidget.replyInputBackground#f6f5f1
editorCommentsWidget.resolvedBorder#bbb5ba
editorCommentsWidget.unresolvedBorder#a29ca6
editorCursor.background#f6f5f1
editorCursor.foreground#3b2633
editorGhostText.background#ffffff
editorGhostText.border#dedcd8
editorGhostText.foreground#3b2633
editorGroup.border#ffffff
editorGroup.dropBackground#e4e3f0
editorGroup.dropIntoPromptBackground#bbb5ba
editorGroup.dropIntoPromptBorder#a29ca6
editorGroup.dropIntoPromptForeground#3b2633
editorGroup.emptyBackground#ffffff
editorGroup.focusedEmptyBorder#8c8094
editorGroupHeader.border#a29ca6
editorGroupHeader.tabsBackground#f6f5f1
editorGroupHeader.tabsBorder#bbb5ba
editorGutter.addedBackground#9957d7
editorGutter.background#f6f5f140
editorGutter.commentGlyphForeground#8c8094
editorGutter.commentRangeForeground#e4e3f0
editorGutter.commentUnresolvedGlyphForeground#77697e
editorGutter.deletedBackground#2f9d31
editorGutter.foldingControlForeground#3b2633
editorGutter.modifiedBackground#6d59c3
editorHoverWidget.background#ffffff
editorHoverWidget.border#afa9d8
editorHoverWidget.foreground#3b2633
editorHoverWidget.highlightForeground#9957d7
editorHoverWidget.statusBarBackground#f6f5f1
editorIndentGuide.activeBackground1#afa9d8
editorIndentGuide.background1#dedcd8
editorInlayHint.background#ffffff
editorInlayHint.foreground#bbb5ba
editorLightBulb.foreground#dbdc5e
editorLightBulbAi.foreground#dcab60
editorLightBulbAutoFix.foreground#9957d7
editorLineNumber.activeForeground#3b2633
editorLineNumber.foreground#a29ca6
editorLink.activeForeground#533baf
editorMarkerNavigation.background#ffffff
editorMarkerNavigationError.background#51c450
editorMarkerNavigationInfo.background#8e84c9
editorMarkerNavigationWarning.background#dbdc5e
editorOverviewRuler.addedForeground#d1aaee
editorOverviewRuler.background#f6f5f1
editorOverviewRuler.border#bbb5ba
editorOverviewRuler.bracketMatchForeground#bbb5ba
editorOverviewRuler.commonContentForeground#6d59c3
editorOverviewRuler.currentContentForeground#dcab60
editorOverviewRuler.deletedForeground#a5da9e
editorOverviewRuler.errorForeground#51c450
editorOverviewRuler.findMatchForeground#d1aaee80
editorOverviewRuler.incomingContentForeground#8e84c9
editorOverviewRuler.infoForeground#e6c484
editorOverviewRuler.inlineChatRemoved#a5da9e
editorOverviewRuler.modifiedForeground#eed8a8
editorOverviewRuler.rangeHighlightForeground#dedcd8
editorOverviewRuler.selectionHighlightForeground#f6f5f180
editorOverviewRuler.warningForeground#b57fe2
editorOverviewRuler.wordHighlightForeground#a29ca6
editorOverviewRuler.wordHighlightStrongForeground#8c8094
editorOverviewRuler.wordHighlightTextForeground#77697e
editorRuler.foreground#a29ca6
editorStickyScroll.background#ffffff
editorStickyScroll.border#afa9d8
editorStickyScrollHover.background#e2c9f4
editorSuggestWidget.background#ffffff
editorSuggestWidget.border#afa9d8
editorSuggestWidget.foreground#3b2633
editorSuggestWidget.highlightForeground#6d59c3
editorSuggestWidget.selectedBackground#e4e3f0
editorSuggestWidget.selectedForeground#3b2633
editorSuggestWidgetStatus.foreground#635466
editorUnicodeHighlight.background#f6f5f1
editorUnicodeHighlight.border#51c450
editorWatermark.foreground#8c8094
editorWhitespace.foreground#dedcd8
editorWidget.background#f6f5f1
editorWidget.border#dedcd8
editorWidget.foreground#635466
editorWidget.resizeBorder#8c8094
errorForeground#2f9d31
focusBorder#afa9d8
foreground#3b2633
git.blame.editorDecorationForeground#8c8094
gitDecoration.addedResourceForeground#7929c9
gitDecoration.conflictingResourceForeground#147db4
gitDecoration.deletedResourceForeground#51c450
gitDecoration.ignoredResourceForeground#a29ca6
gitDecoration.modifiedResourceForeground#817032
gitDecoration.stageDeletedResourceForeground#51c450
gitDecoration.stageModifiedResourceForeground#817032
gitDecoration.submoduleResourceForeground#6d59c3
gitDecoration.untrackedResourceForeground#2f9d31
icon.foreground#635466
input.background#ffffff
input.border#dedcd8
input.foreground#635466
input.placeholderForeground#8c8094
inputOption.activeBackground#e4e3f0
inputOption.activeBorder#ffffff
inputOption.activeForeground#3b2633
inputOption.hoverBackground#dedcd8
list.activeSelectionBackground#e4e3f0
list.activeSelectionForeground#3b2633
list.deemphasizedForeground#8c8094
list.dropBackground#e4e3f0
list.dropBetweenBackground#bbb5ba
list.errorForeground#ca1a24
list.filterMatchBackground#e1e683
list.filterMatchBorder#e7eea6
list.focusAndSelectionOutline#afa9d8
list.focusBackground#cbc7e4
list.focusForeground#635466
list.focusHighlightForeground#dcab60
list.focusOutline#afa9d8
list.highlightForeground#dcab60
list.hoverBackground#e4e3f0
list.hoverForeground#3b2633
list.inactiveFocusBackground#cbc7e4
list.inactiveFocusOutline#afa9d8
list.inactiveSelectionBackground#cbc7e4
list.inactiveSelectionForeground#3b2633
list.warningForeground#a09535
listFilterWidget.background#f4c6c2
listFilterWidget.noMatchesOutline#51c450
listFilterWidget.outline#f6f5f1
menu.background#f6f5f1
menu.border#dedcd8
menu.foreground#4f3d4d
menu.selectionBackground#533baf
menu.selectionForeground#f6f5f1
menu.separatorBackground#dedcd8
menubar.selectionBackground#cbc7e4
menubar.selectionForeground#412a8e
merge.border#6d59c3
merge.commonContentBackground#bbb5ba80
merge.commonHeaderBackground#8c809480
merge.currentContentBackground#afa9d880
merge.currentHeaderBackground#6d59c380
merge.incomingContentBackground#eed8a880
merge.incomingHeaderBackground#dcab6080
mergeEditor.change.background#e4e3f0
mergeEditor.change.word.background#cbc7e4
mergeEditor.changeBase.background#f6f5f1
mergeEditor.changeBase.word.background#dedcd8
mergeEditor.conflict.handled.minimapOverViewRuler#afa9d8
mergeEditor.conflict.handledFocused.border#b57fe2
mergeEditor.conflict.handledUnfocused.border#d1aaee
mergeEditor.conflict.input1.background#f9f1d8
mergeEditor.conflict.input2.background#f4e5bf
mergeEditor.conflict.unhandled.minimapOverViewRuler#8e84c9
mergeEditor.conflict.unhandledFocused.border#81c97c
mergeEditor.conflict.unhandledUnfocused.border#a5da9e
mergeEditor.conflictingLines.background#f6f5f1
minimap.background#f6f5f1
minimap.errorHighlight#51c450
minimap.findMatchHighlight#8c809480
minimap.foregroundOpacity#3b26331a
minimap.infoHighlight#cb862b
minimap.selectionHighlight#dcab6080
minimap.selectionOccurrenceHighlight#635466
minimap.warningHighlight#dbdc5e
notebook.cellBorderColor#dedcd8
notebook.cellEditorBackground#ffffff
notebook.cellHoverBackground#f6f5f1
notebook.cellInsertionIndicator#bbb5ba
notebook.cellStatusBarItemHoverBackground#f6f5f1
notebook.cellToolbarSeparator#dedcd8
notebook.editorBackground#ffffff
notebook.focusedCellBackground#f6f5f1
notebook.focusedCellBorder#dedcd8
notebook.focusedEditorBorder#bbb5ba
notebook.inactiveFocusedCellBorder#f6f5f1
notebook.inactiveSelectedCellBorder#f6f5f1
notebook.outputContainerBackgroundColor#ffffff
notebook.outputContainerBorderColor#dedcd8
notebook.selectedCellBackground#635466
notebook.selectedCellBorder#f6f5f1
notebookScrollbarSlider.activeBackground#f6f5f1
notebookScrollbarSlider.background#635466
notebookScrollbarSlider.hoverBackground#f6f5f1
notificationCenter.border#e4e3f0
notificationCenterHeader.background#ffffff
notificationCenterHeader.foreground#635466
notifications.background#fdfdfd
notifications.border#ffffff
notifications.foreground#635466
notificationsErrorIcon.foreground#51c450
notificationsInfoIcon.foreground#8e84c9
notificationsWarningIcon.foreground#dbdc5e
notificationToast.border#e4e3f0
outputView.background#ffffff
panel.background#ffffff
panel.border#afa9d8
panel.dropBorder#e4e3f0
panelSection.border#ffffff
panelSectionHeader.background#f6f5f1
panelSectionHeader.border#dedcd8
panelSectionHeader.foreground#3b2633
panelStickyScroll.background#f6f5f1
panelStickyScroll.border#dedcd8
panelTitle.activeBorder#afa9d8
panelTitle.activeForeground#3b2633
panelTitle.border#ffffff
panelTitle.inactiveForeground#635466
peekView.border#6d59c3
peekViewEditor.background#fdfdfd
peekViewEditor.matchHighlightBackground#dbdc5e
peekViewEditor.matchHighlightBorder#cfcd49
peekViewEditorGutter.background#fdfdfd
peekViewResult.background#fdfdfd
peekViewResult.fileForeground#3b2633
peekViewResult.lineForeground#635466
peekViewResult.matchHighlightBackground#f4c6c2
peekViewResult.selectionBackground#e4e3f0
peekViewResult.selectionForeground#635466
peekViewTitle.background#ffffff
peekViewTitleDescription.foreground#635466
peekViewTitleLabel.foreground#3b2633
pickerGroup.border#dedcd8
pickerGroup.foreground#6d59c3
problemsErrorIcon.foreground#51c450
problemsInfoIcon.foreground#dcab60
problemsWarningIcon.foreground#9957d7
progressBar.background#6d59c3
quickInput.background#ffffff
quickInput.foreground#3b2633
quickInputList.focusBackground#f6f5f1
quickInputList.focusForeground#3b2633
quickInputList.focusIconForeground#8c8094
quickInputTitle.background#f6f5f1
sash.hoverBorder#9957d7
scrollbarSlider.activeBackground#8e84c9
scrollbarSlider.background#afa9d8
scrollbarSlider.hoverBackground#afa9d8
search.resultsInfoForeground#635466
searchEditor.findMatchBackground#cbc7e4
searchEditor.findMatchBorder#afa9d8
searchEditor.textInputBorder#8e84c9
selection.background#afa9d8
settings.focusedRowBackground#ffffff
settings.headerBorder#f6f5f1
settings.headerForeground#635466
settings.sashBorder#dedcd8
sideBar.background#f6f5f1
sideBar.border#dedcd8
sideBar.dropBackground#f6f5f1
sideBar.foreground#3b2633
sideBarSectionHeader.background#dedcd8
sideBarSectionHeader.border#bbb5ba
sideBarSectionHeader.foreground#635466
sideBarStickyScroll.background#dedcd8
sideBarStickyScroll.border#a29ca6
sideBarTitle.background#dedcd8
sideBarTitle.border#bbb5ba
sideBarTitle.foreground#3b2633
sideBySideEditor.horizontalBorder#77697e
sideBySideEditor.verticalBorder#635466
statusBar.background#cbc7e4
statusBar.border#bbb5ba
statusBar.debuggingBackground#3ab63b
statusBar.debuggingForeground#ffffff
statusBar.foreground#3b2633
statusBar.noFolderBackground#6d59c3
statusBar.noFolderBorder#bbb5ba
statusBar.noFolderForeground#ffffff
statusBarItem.activeBackground#ffffff
statusBarItem.hoverBackground#d1aaee
statusBarItem.remoteBackground#d1aaee
statusBarItem.remoteForeground#3b2633
tab.activeBackground#cbc7e4
tab.border#bbb5ba
tab.hoverBackground#e4e3f0
tab.hoverForeground#3b2633
tab.inactiveBackground#f6f5f1
tab.inactiveForeground#bbb5ba
tab.selectedBackground#ffffff
tab.selectedForeground#3b2633
tab.unfocusedActiveBackground#cbc7e4
tab.unfocusedActiveForeground#77697e
tab.unfocusedHoverBackground#f6f5f1
tab.unfocusedHoverForeground#635466
tab.unfocusedInactiveBackground#f6f5f1
tab.unfocusedInactiveForeground#a29ca6
terminal.ansiBlack#3b2633
terminal.ansiBlue#533baf
terminal.ansiBrightBlack#635466
terminal.ansiBrightBlue#6d59c3
terminal.ansiBrightCyan#2aa7e2
terminal.ansiBrightGreen#51c450
terminal.ansiBrightMagenta#9957d7
terminal.ansiBrightRed#de4a4f
terminal.ansiBrightWhite#ffffff
terminal.ansiBrightYellow#dbdc5e
terminal.ansiCyan#147db4
terminal.ansiGreen#2f9d31
terminal.ansiMagenta#7929c9
terminal.ansiRed#ca1a24
terminal.ansiWhite#dedcd8
terminal.ansiYellow#c0b937
terminal.background#ffffff
terminal.border#ffffff
terminal.dropBackground#e4e3f0
terminal.foreground#3b2633
terminal.inactiveSelectionBackground#f6f5f1
terminal.selectionBackground#bbb5ba
terminalCommandDecoration.defaultBackground#f6f5f1
terminalCommandDecoration.errorBackground#a5da9e
terminalCommandDecoration.successBackground#d1aaee
terminalCursor.background#6d59c3
terminalCursor.foreground#ffffff
terminalOverviewRuler.border#dedcd8
terminalOverviewRuler.cursorForeground#bfe6b9
terminalOverviewRuler.findMatchForeground#eef4be
terminalStickyScroll.background#ffffff
terminalStickyScroll.border#dedcd8
terminalStickyScrollHover.background#f6f5f1
testing.iconErrored#51c450
testing.iconFailed#81c97c
testing.iconPassed#9957d7
testing.iconQueued#e1e683
testing.iconSkipped#e6c484
testing.iconUnset#bbb5ba
testing.message.error.lineBackground#d9f1d3
testing.message.info.decorationForeground#3b2633
testing.message.info.lineBackground#f9f1d8
testing.peekBorder#dedcd8
testing.peekHeaderBackground#f6f5f1
testing.runAction#afa9d8
textLink.activeForeground#9957d7
textLink.foreground#6d59c3
titleBar.activeBackground#f6f5f1
titleBar.activeForeground#4f3d4d
titleBar.border#bbb5ba
titleBar.inactiveBackground#dedcd8
titleBar.inactiveForeground#3b2633
tree.inactiveIndentGuidesStroke#8c809466
tree.indentGuidesStroke#8c8094
tree.tableColumnsBorder#bbb5ba20
tree.tableOddRowsBackground#bbb5ba0a
walkThrough.embeddedEditorBackground#dedcd8
walkthrough.stepTitle.foreground#3b2633
welcomePage.background#ffffff
welcomePage.progress.background#e4e3f0
welcomePage.progress.foreground#dedcd8
welcomePage.tileBackground#f6f5f1
welcomePage.tileBorder#dedcd8
welcomePage.tileHoverBackground#e4e3f0
widget.border#8c8094
window.activeBorder#afa9d8
window.inactiveBorder#635466

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment, comment.line, comment.block, comment.block.documentation, punctuation.definition.comment, meta.toc-list	#bbb5ba	italic
constant, constant.numeric, constant.numeric.integer, constant.numeric.integer.binary, constant.numeric.integer.octal, constant.numeric.integer.decimal, constant.numeric.integer.hexadecimal, constant.numeric.integer.other, constant.numeric.float, constant.numeric.float.binary, constant.numeric.float.octal, constant.numeric.float.decimal, constant.numeric.float.hexadecimal, constant.numeric.float.other, constant.numeric.complex, constant.numeric.complex.real, constant.numeric.complex.imaginary, constant.language, constant.character.escape, constant.other.placeholder, constant.other	#147db4
entity.name.class, entity.name.struct, entity.name.enum, entity.name.union, entity.name.trait, entity.name.interface, entity.name.impl, entity.name.type, entity.name.class.ford-decl, entity.other.inherited-class, entity.name.function.constructor, entity.name.function.destructor, entity.name.namespace, entity.name.constant, entity.name.label, entity.name.tag, entity.name.section, entity.other.attribute-name	#533baf	bold
entity.name.function, entity.name.function.constructor, entity.name.function.destructor	#7929c9	bold italic
keyword, keyword.control, keyword.control.conditional, keyword.control.import, punctuation.definition.keyword, keyword.operator, keyword.operator.assignment, keyword.operator.arithmetic, keyword.operator.bitwise, keyword.operator.logical, keyword.operator.word, keyword.other	#cb862b
markup.heading, markup.list.numbered, markup.list.unnumbered, markup.bold, markup.italic, markup.underline, markup.inserted, markup.deleted, markup.underline.link, markup.quote, markup.raw.inline, markup.raw.block, markup.other	#3b2633
markup.underline	—	underline
markup.bold	#cb862b	bold
markup.heading	#2f9d31	bold
markup.italic	—	italic
markup.inserted	#7929c9	—
markup.deleted	#2f9d31	—
markup.changed	#cb862b	—
markup.inline.raw	#2f9d31	—
punctuation.definition.tag	#2f9d31	—
meta.class, meta.struct, meta.enum, meta.union, meta.trait, meta.interface, meta.impl, meta.type, meta.function, meta.function.parameters, meta.function.return-type, meta.namespace, meta.preprocessor, meta.annotation, meta.annotation.identifier, meta.annotation.parameters, meta.path, meta.function-call, meta.block, meta.braces, meta.group, meta.parens, meta.brackets, meta.generic, meta.tag, meta.paragraph	#635466
storage, storage.type, storage.modifier, storage.type.function, storage.type.class, storage.type.struct, storage.type.enum, storage.type.union, storage.type.trait, storage.type.interface, storage.type.impl, storage.type keyword.declaration.type	#cb862b
string, string.quoted, string.quoted.single, string.quoted.double, string.quoted.triple, string.quoted.other, meta.string, punctuation.definition.string.begin, punctuation.definition.string.end, string.quoted.unquoted, string.quoted.regexp, meta.interpolated, punctuation.section.interpolation.begin, punctuation.section.interpolation.end, source.language-suffix.embedded	#2f9d31
support, support.class, support.constant, support.function, support.other, support.property-value, support.type, support.variable, support.module	#3b2633	bold
support.class, support.function, support.module	#533baf	bold
support.constant, support.other, support.property-value, support.type, support.variable	#533baf
variable, variable.other, variable.other.readwrite, punctuation.definition.variable, variable.other.constant, variable.language, variable.parameter, variable.other.member, variable.function, variable.annotation, punctuation.definition.annotation	#3b2633
variable.language	#3b2633	italic
variable.other, variable.other.member	#7929c9
variable.parameter	#2f9d31
	#3b2633
punctuation.separator, punctuation.terminator, punctuation.separator.continuation, punctuation.accessor	#635466
source	#635466
text.html, text.xml	#635466
invalid, invalid.illegal, invalid.deprecated	#2f9d31	underline
punctuation.definition.tag, punctuation.definition.annotation, punctuation.section.block.begin, punctuation.section.block.end, punctuation.section.braces.begin, punctuation.section.braces.end, punctuation.section.group.begin, punctuation.section.group.end, punctuation.section.parens.begin, punctuation.section.parens.end, punctuation.section.brackets.begin, punctuation.section.brackets.end, punctuation.definition.generic.begin, punctuation.definition.generic.end	#2f9d31	—