ZeroToSaaS Accessibility Theme Suite

Name: ZeroToSaaS Accessibility Theme Suite
Author: ZeroToSaaS.in

Publisher: ZeroToSaaS.inThemes in package: 20

Medically optimized, WCAG AAA compliant themes with Semantic Cognitive Status (Safe, Caution, Warning, Panic) and contextual file-type adaptation.

Open in VS Code GitHub

Color themes

VS Code preview

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

ZeroToSaaS Accessibility Theme Suite — ZeroToSaaS Royal Plum Night (Purple)

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#BD87F4
activityBar.background#1B181E
activityBar.border#2E2D31
activityBar.foreground#BD87F4
activityBar.inactiveForeground#A09AA7
activityBarBadge.background#BD87F4
activityBarBadge.foreground#FFFFFF
badge.background#BD87F4
badge.foreground#FFFFFF
breadcrumb.activeSelectionForeground#BD87F4
breadcrumb.background#0E0C12
breadcrumb.focusForeground#EAE5F0
breadcrumb.foreground#A09AA7
button.background#BD87F4
button.foreground#FFFFFF
button.hoverBackground#CCA1FA
button.secondaryBackground#141117
button.secondaryForeground#EAE5F0
button.secondaryHoverBackground#201E22
chat.avatarBackground#BD87F4
chat.avatarForeground#FFFFFF
chat.linesAddedForeground#78C193
chat.linesRemovedForeground#FB7695
chat.requestBackground#141117
chat.requestBorder#2E2D31
chat.slashCommandBackground#BD87F41A
chat.slashCommandForeground#BD87F4
commandCenter.activeBackground#201E22
commandCenter.activeBorder#BD87F4
commandCenter.activeForeground#EAE5F0
commandCenter.background#141117
commandCenter.border#2E2D31
commandCenter.foreground#EAE5F0
commandCenter.inactiveBorder#2E2D31
commandCenter.inactiveForeground#A09AA7
debugConsole.background#0E0C12
debugConsole.errorForeground#FB7695
debugConsole.foreground#EAE5F0
debugConsole.infoForeground#78C193
debugConsole.sourceForeground#A09AA7
debugConsole.warningForeground#EE946A
debugConsoleInputIcon.foreground#BD87F4
debugIcon.breakpointCurrentStackframeForeground#DAAF76
debugIcon.breakpointDisabledForeground#A09AA780
debugIcon.breakpointForeground#FB7695
debugIcon.breakpointStackframeForeground#78C193
debugIcon.breakpointUnverifiedForeground#EE946A
debugIcon.continueForeground#78C193
debugIcon.disconnectForeground#FB7695
debugIcon.pauseForeground#DAAF76
debugIcon.restartForeground#78C193
debugIcon.startForeground#78C193
debugIcon.stepBackForeground#BD87F4
debugIcon.stepIntoForeground#BD87F4
debugIcon.stepOutForeground#BD87F4
debugIcon.stepOverForeground#BD87F4
debugIcon.stopForeground#FB7695
debugTokenExpression.boolean#C79C64
debugTokenExpression.error#FB7695
debugTokenExpression.name#ECDDFF
debugTokenExpression.number#F77392
debugTokenExpression.string#E48B61
debugTokenExpression.value#E48B61
debugToolBar.background#141117
debugToolBar.border#2E2D31
debugView.stateLabelForeground#BD87F4
debugView.valueChangedHighlight#1E1A12
descriptionForeground#A09AA7
diffEditor.border#2E2D31
diffEditor.insertedTextBackground#0F1913CC
diffEditor.removedTextBackground#1B1417CC
disabledForeground#A09AA7AA
dropdown.background#0E0C12
dropdown.border#434145
dropdown.foreground#EAE5F0
editor.background#0E0C12
editor.findMatchBackground#1E1A12
editor.findMatchBorder#DAAF76
editor.findMatchHighlightBackground#1E1A12CC
editor.foreground#EAE5F0
editor.hoverHighlightBackground#141117
editor.inactiveSelectionBackground#41046780
editor.lineHighlightBackground#14111777
editor.lineHighlightBorder#00000000
editor.selectionBackground#410467B3
editor.selectionHighlightBackground#41046766
editor.selectionHighlightBorder#BD87F44D
editor.wordHighlightBackground#BD87F41A
editor.wordHighlightStrongBackground#BD87F42E
editorActionList.background#0E0C12
editorActionList.focusBackground#201E22
editorActionList.focusForeground#EAE5F0
editorActionList.foreground#EAE5F0
editorAI.background#BD87F415
editorAI.border#BD87F44D
editorAI.foreground#BD87F4
editorBracketHighlight.foreground1#BD87F4
editorBracketHighlight.foreground2#78C193
editorBracketHighlight.foreground3#DAAF76
editorBracketHighlight.foreground4#A698E4
editorBracketHighlight.foreground5#6EB78A
editorBracketHighlight.foreground6#EE946A
editorBracketMatch.background#201E22
editorBracketMatch.border#BD87F4
editorCursor.foreground#BD87F4
editorError.foreground#FB7695
editorGhostText.background#00000000
editorGhostText.border#00000000
editorGhostText.foreground#A09AA7CC
editorGroup.border#2E2D31
editorGroupHeader.noTabsBackground#0E0C12
editorGroupHeader.tabsBackground#141117
editorGroupHeader.tabsBorder#2E2D31
editorHint.foreground#78C193
editorHoverWidget.background#0E0C12
editorHoverWidget.border#434145
editorHoverWidget.foreground#EAE5F0
editorHoverWidget.statusBarBackground#141117
editorIndentGuide.activeBackground#BD87F4
editorIndentGuide.activeBackground1#BD87F4
editorIndentGuide.activeBackground2#78C193
editorIndentGuide.activeBackground3#DAAF76
editorIndentGuide.activeBackground4#A698E4
editorIndentGuide.activeBackground5#6EB78A
editorIndentGuide.activeBackground6#EE946A
editorIndentGuide.background#2E2D31
editorIndentGuide.background1#BD87F425
editorIndentGuide.background2#78C19325
editorIndentGuide.background3#DAAF7625
editorIndentGuide.background4#A698E425
editorIndentGuide.background5#6EB78A25
editorIndentGuide.background6#EE946A25
editorInfo.foreground#BD87F4
editorInlayHint.background#201E2299
editorInlayHint.foreground#A09AA7
editorInlayHint.parameterForeground#C79C64
editorInlayHint.typeForeground#6EB78A
editorLineNumber.activeForeground#BD87F4
editorLineNumber.foreground#A09AA799
editorLink.activeForeground#BD87F4
editorStickyScroll.background#141117
editorStickyScroll.border#2E2D31
editorStickyScroll.shadow#00000044
editorStickyScrollHover.background#201E22
editorSuggestWidget.background#0E0C12
editorSuggestWidget.border#434145
editorSuggestWidget.focusHighlightForeground#BD87F4
editorSuggestWidget.foreground#EAE5F0
editorSuggestWidget.highlightForeground#BD87F4
editorSuggestWidget.selectedBackground#201E22
editorSuggestWidget.selectedForeground#EAE5F0
editorSuggestWidget.selectedIconForeground#BD87F4
editorWarning.foreground#EE946A
editorWidget.background#0E0C12
editorWidget.border#434145
editorWidget.foreground#EAE5F0
editorWidget.resizeBorder#BD87F4
errorForeground#FB7695
focusBorder#BD87F4
foreground#EAE5F0
gitDecoration.addedResourceForeground#78C193
gitDecoration.conflictingResourceForeground#EE946A
gitDecoration.deletedResourceForeground#FB7695
gitDecoration.ignoredResourceForeground#A09AA788
gitDecoration.modifiedResourceForeground#DAAF76
gitDecoration.untrackedResourceForeground#78C193
icon.foreground#EAE5F0
inlineChat.background#0E0C12
inlineChat.border#434145
inlineChat.regionHighlight#BD87F41A
inlineChat.shadow#00000055
inlineChatDiff.inserted#0F1913CC
inlineChatDiff.removed#1B1417CC
inlineChatInput.background#141117
inlineChatInput.border#2E2D31
inlineChatInput.focusBorder#BD87F4
inlineChatInput.placeholderForeground#A09AA7
inlineEdit.border#434145
inlineEdit.indicator.background#BD87F4
inlineEdit.indicator.border#CCA1FA
inlineEdit.indicator.foreground#FFFFFF
inlineEdit.modifiedBackground#0F191380
inlineEdit.originalBackground#1B141780
input.background#0E0C12
input.border#434145
input.foreground#EAE5F0
input.placeholderForeground#A09AA7
inputOption.activeBorder#BD87F4
inputValidation.errorBackground#1B1417
inputValidation.errorBorder#FB7695
inputValidation.infoBackground#0F1913
inputValidation.infoBorder#78C193
inputValidation.warningBackground#1B150E
inputValidation.warningBorder#EE946A
interactive.activeCodeBorder#BD87F4
interactive.inactiveCodeBorder#2E2D31
interactive.requestBorder#2E2D31
keybindingLabel.background#141117
keybindingLabel.border#434145
keybindingLabel.bottomBorder#434145
keybindingLabel.foreground#EAE5F0
list.activeSelectionBackground#201E22
list.activeSelectionForeground#EAE5F0
list.activeSelectionIconForeground#BD87F4
list.errorForeground#FB7695
list.focusBackground#201E22
list.focusForeground#EAE5F0
list.focusHighlightForeground#BD87F4
list.highlightForeground#BD87F4
list.hoverBackground#201E2266
list.hoverForeground#EAE5F0
list.inactiveFocusBackground#41046755
list.inactiveSelectionBackground#41046777
list.inactiveSelectionForeground#EAE5F0
list.inactiveSelectionIconForeground#BD87F4
list.warningForeground#EE946A
menu.background#0E0C12
menu.border#434145
menu.foreground#EAE5F0
menu.selectionBackground#201E22
menu.selectionBorder#BD87F4
menu.selectionForeground#EAE5F0
menu.separatorBackground#2E2D31
menubar.selectionBackground#201E22
menubar.selectionForeground#EAE5F0
multiDiffEditor.background#0E0C12
multiDiffEditor.border#2E2D31
multiDiffEditor.headerBackground#141117
notificationCenter.border#434145
notifications.background#0E0C12
notifications.border#2E2D31
notifications.foreground#EAE5F0
notificationToast.border#434145
outputView.background#0E0C12
outputViewStickyScroll.background#141117
panel.background#17151B
panel.border#2E2D31
panelSection.border#2E2D31
panelSection.dropBackground#201E22
panelSectionHeader.background#141117
panelSectionHeader.border#2E2D31
panelSectionHeader.foreground#EAE5F0
panelTitle.activeBorder#BD87F4
panelTitle.activeForeground#EAE5F0
panelTitle.inactiveForeground#A09AA7
peekView.border#BD87F4
peekViewEditor.background#141117
peekViewEditor.matchHighlightBackground#1E1A12
peekViewResult.background#17151B
peekViewResult.matchHighlightBackground#1E1A12
peekViewResult.selectionBackground#201E22
peekViewTitle.background#141117
problemsErrorIcon.foreground#FB7695
problemsInfoIcon.foreground#BD87F4
problemsWarningIcon.foreground#EE946A
quickInput.background#0E0C12
quickInput.foreground#EAE5F0
quickInputList.focusBackground#201E22
searchEditor.findMatchBackground#1E1A12
searchEditor.findMatchBorder#DAAF76
selection.background#201E22
settings.focusedRowBackground#201E2250
settings.headerForeground#BD87F4
settings.modifiedItemIndicator#BD87F4
settings.rowHoverBackground#201E2225
sideBar.background#17151B
sideBar.border#2E2D31
sideBar.foreground#EAE5F0
sideBarSectionHeader.background#141117
sideBarSectionHeader.border#2E2D31
sideBarSectionHeader.foreground#EAE5F0
sideBarTitle.foreground#BD87F4
statusBar.background#3C0061
statusBar.border#3C0061
statusBar.debuggingBackground#1B150E
statusBar.debuggingForeground#EE946A
statusBar.foreground#FFFFFF
statusBar.noFolderBackground#3C0061
statusBar.noFolderForeground#FFFFFF
statusBarItem.hoverBackground#FFFFFF25
statusBarItem.remoteBackground#00000030
statusBarItem.remoteForeground#FFFFFF
symbolIcon.arrayForeground#ECDDFF
symbolIcon.booleanForeground#F77392
symbolIcon.classForeground#6EB78A
symbolIcon.colorForeground#F77392
symbolIcon.constantForeground#C79C64
symbolIcon.eventForeground#A698E4
symbolIcon.fieldForeground#ECDDFF
symbolIcon.fileForeground#EAE5F0
symbolIcon.folderForeground#BD87F4
symbolIcon.functionForeground#A698E4
symbolIcon.interfaceForeground#6EB78A
symbolIcon.keyForeground#BD87F4
symbolIcon.keywordForeground#BD87F4
symbolIcon.methodForeground#A698E4
symbolIcon.moduleForeground#BD87F4
symbolIcon.nullForeground#C79C64
symbolIcon.numberForeground#F77392
symbolIcon.objectForeground#6EB78A
symbolIcon.operatorForeground#ECDDFF
symbolIcon.packageForeground#BD87F4
symbolIcon.propertyForeground#ECDDFF
symbolIcon.snippetForeground#BD87F4
symbolIcon.stringForeground#E48B61
symbolIcon.structForeground#6EB78A
symbolIcon.textForeground#EAE5F0
symbolIcon.typeParameterForeground#6EB78A
symbolIcon.unitForeground#C79C64
symbolIcon.variableForeground#ECDDFF
tab.activeBackground#0E0C12
tab.activeBorder#BD87F4
tab.activeBorderTop#BD87F4
tab.activeForeground#EAE5F0
tab.border#2E2D31
tab.hoverBackground#0E0C12
tab.hoverForeground#EAE5F0
tab.inactiveBackground#141117
tab.inactiveForeground#A09AA7
tab.unfocusedActiveBackground#0E0C12
tab.unfocusedActiveForeground#EAE5F0
tab.unfocusedInactiveForeground#A09AA7
terminal.ansiBlack#141117
terminal.ansiBlue#BD87F4
terminal.ansiBrightBlack#17151B
terminal.ansiBrightBlue#CCA1FA
terminal.ansiBrightCyan#6EB78A
terminal.ansiBrightGreen#78C193
terminal.ansiBrightMagenta#A698E4
terminal.ansiBrightRed#FB7695
terminal.ansiBrightWhite#FFFFFF
terminal.ansiBrightYellow#DAAF76
terminal.ansiCyan#6EB78A
terminal.ansiGreen#78C193
terminal.ansiMagenta#A698E4
terminal.ansiRed#FB7695
terminal.ansiWhite#EAE5F0
terminal.ansiYellow#DAAF76
terminal.background#0E0C12
terminal.border#2E2D31
terminal.findMatchBackground#1E1A12
terminal.findMatchBorder#DAAF76
terminal.findMatchHighlightBackground#1E1A12CC
terminal.foreground#EAE5F0
terminal.hoverHighlightBackground#141117
terminal.inactiveSelectionBackground#41046755
terminal.selectionBackground#410467B3
terminal.tab.activeBorder#BD87F4
terminalCommandDecoration.defaultBackground#BD87F480
terminalCommandDecoration.errorBackground#FB7695
terminalCommandDecoration.successBackground#78C193
terminalCursor.background#0E0C12
terminalCursor.foreground#BD87F4
terminalOverviewRuler.cursorForeground#BD87F4
terminalOverviewRuler.findMatchForeground#DAAF76
titleBar.activeBackground#17151B
titleBar.activeForeground#EAE5F0
titleBar.border#2E2D31
titleBar.inactiveBackground#141117
titleBar.inactiveForeground#A09AA7
walkThrough.embeddedEditorBackground#141117
welcomePage.background#0E0C12
welcomePage.buttonBackground#141117
welcomePage.buttonHoverBackground#201E22
widget.shadow#00000066

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment, comment.line, comment.line.double-slash, comment.line.triple-slash, comment.line.number-sign, comment.line.dashes, comment.line.character, comment.line.percentage, comment.block, comment.block.documentation, punctuation.definition.comment, string.comment, string.quoted.docstring, string.quoted.docstring.multi, string.quoted.docstring.multi.python, string.quoted.docstring.single.python, string.quoted.double.block.python, string.quoted.single.block.python, source.kotlin comment, source.kotlin comment.line, source.kotlin comment.block, source.kotlin comment.block.documentation, source.swift comment, source.go comment, source.rust comment, source.dart comment, source.java comment, source.ts comment, source.tsx comment, source.js comment, source.jsx comment, source.python comment, source.sql comment, source.shell comment, source.yaml comment	#AE9BC7	italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical, keyword.operator.delete, storage, storage.type, storage.modifier	#BD87F4	bold
entity.name.function, support.function, meta.function-call, variable.function	#A698E4	—
entity.name.type, entity.name.class, entity.name.struct, entity.name.enum, entity.name.interface, support.class, support.type, entity.other.inherited-class	#6EB78A	bold
constant, constant.language, constant.numeric, support.constant	#C79C64	—
variable, variable.other, variable.other.readwrite, variable.other.property	#ECDDFF	—
keyword.operator, punctuation, punctuation.accessor, punctuation.separator	#ECDDFF	—
invalid, invalid.illegal, invalid.deprecated	#FB7695	bold underline
constant.other.color, constant.other.color.rgb-value, constant.other.uuid, support.constant.color, keyword.other.dotenv, source.env variable.other.key, source.dotenv variable.other.key	#FB7695	—
string.regexp, string.regexp constant.character.escape, constant.other.character-class.regexp	#FB7695	—
source.python string.quoted, source.js string.quoted, source.jsx string.quoted, source.ts string.quoted, source.tsx string.quoted, source.rust string.quoted, source.go string.quoted, source.kotlin string.quoted, source.swift string.quoted, source.dart string.quoted, source.sql string.quoted	#EE946A	—
source.js string.template, source.ts string.template, source.tsx string.template, source.python string.interpolated	#EE946A	—
source.python variable.parameter, source.js variable.parameter, source.jsx variable.parameter, source.ts variable.parameter, source.tsx variable.parameter, source.rust variable.parameter, source.go variable.parameter, source.kotlin variable.parameter, source.swift variable.parameter, source.dart variable.parameter	#DAAF76	—
source.ts entity.name.type, source.tsx entity.name.type, source.rust entity.name.type, source.go entity.name.type, source.kotlin entity.name.type, source.swift entity.name.type, source.dart entity.name.type, source.python entity.name.type.class	#78C193	bold
source.python entity.name.function.decorator, source.python variable.language.special.self, source.python variable.language.special.cls	#CCA1FA	italic
source.python support.function.magic	#A698E4	bold
source.jsx entity.name.tag, source.tsx entity.name.tag, source.jsx support.class.component, source.tsx support.class.component	#78C193	bold
source.jsx entity.other.attribute-name, source.tsx entity.other.attribute-name	#DAAF76	—
source.sql keyword.other.DML, source.sql keyword.other.DDL, source.sql keyword.other.order, source.sql keyword.other.create	#BD87F4	bold
source.sql constant.other.database-name, source.sql constant.other.table-name	#6EB78A	—
source.rust storage.modifier.lifetime, source.rust entity.name.function.macro	#A698E4	bold
source.go entity.name.package, source.go keyword.channel	#BD87F4	bold
source.kotlin storage.type.annotation, source.swift storage.type.annotation, source.swift keyword.other.declaration-specifier	#A698E4	—
source.dart storage.type.annotation, source.dart support.class.flutter	#78C193	bold
source.json support.type.property-name	#78C193	bold
source.yaml entity.name.tag	#78C193	bold
source.toml entity.other.attribute-name.table, source.toml keyword.key	#78C193	bold
source.ini entity.name.section, source.ini keyword.other.definition	#78C193	bold
source.env variable.other.key, source.dotenv variable.other.key, source.env keyword.other	#FB7695	bold
text.html.markdown, text.plain, meta.paragraph.markdown	#EAE5F0	—
text.html.markdown markup.heading, text.html.markdown entity.name.section, text.html.markdown punctuation.definition.heading	#BD87F4	bold
text.html.markdown markup.inline.raw, text.html.markdown markup.fenced_code	#78C193	—
text.html.markdown markup.underline.link, text.html.markdown string.other.link	#BD87F4	underline
text.html.markdown markup.quote	#AE9BC7	italic
text.html entity.name.tag, text.xml entity.name.tag	#BD87F4	bold
text.html entity.other.attribute-name, text.xml entity.other.attribute-name	#A698E4	—
log.error, log.fatal, log.critical, log.exception	#FB7695	bold
log.warning, log.warn	#EE946A	bold
log.info, log.notice	#78C193	bold
log.debug, log.trace	#DAAF76	—
log.date, log.timestamp	#A09AA7	—

VS Code preview

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

ZeroToSaaS Accessibility Theme Suite — ZeroToSaaS Royal Plum (Purple)

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#5B2188
activityBar.background#E4DCEB
activityBar.border#CBBED5
activityBar.foreground#5B2188
activityBar.inactiveForeground#5A486F
activityBarBadge.background#5B2188
activityBarBadge.foreground#FFFFFF
badge.background#5B2188
badge.foreground#FFFFFF
breadcrumb.activeSelectionForeground#5B2188
breadcrumb.background#FAF8FD
breadcrumb.focusForeground#1A0E26
breadcrumb.foreground#5A486F
button.background#5B2188
button.foreground#FFFFFF
button.hoverBackground#401362
button.secondaryBackground#F2EDF7
button.secondaryForeground#1A0E26
button.secondaryHoverBackground#D9CDE2
chat.avatarBackground#5B2188
chat.avatarForeground#FFFFFF
chat.linesAddedForeground#0A5E36
chat.linesRemovedForeground#910A3E
chat.requestBackground#F2EDF7
chat.requestBorder#CBBED5
chat.slashCommandBackground#5B21881A
chat.slashCommandForeground#5B2188
commandCenter.activeBackground#D9CDE2
commandCenter.activeBorder#5B2188
commandCenter.activeForeground#1A0E26
commandCenter.background#F2EDF7
commandCenter.border#CBBED5
commandCenter.foreground#1A0E26
commandCenter.inactiveBorder#CBBED5
commandCenter.inactiveForeground#5A486F
debugConsole.background#FAF8FD
debugConsole.errorForeground#910A3E
debugConsole.foreground#1A0E26
debugConsole.infoForeground#0A5E36
debugConsole.sourceForeground#5A486F
debugConsole.warningForeground#843400
debugConsoleInputIcon.foreground#5B2188
debugIcon.breakpointCurrentStackframeForeground#6A4400
debugIcon.breakpointDisabledForeground#5A486F80
debugIcon.breakpointForeground#910A3E
debugIcon.breakpointStackframeForeground#0A5E36
debugIcon.breakpointUnverifiedForeground#843400
debugIcon.continueForeground#0A5E36
debugIcon.disconnectForeground#910A3E
debugIcon.pauseForeground#6A4400
debugIcon.restartForeground#0A5E36
debugIcon.startForeground#0A5E36
debugIcon.stepBackForeground#5B2188
debugIcon.stepIntoForeground#5B2188
debugIcon.stepOutForeground#5B2188
debugIcon.stepOverForeground#5B2188
debugIcon.stopForeground#910A3E
debugTokenExpression.boolean#6A4400
debugTokenExpression.error#910A3E
debugTokenExpression.name#1A0E26
debugTokenExpression.number#910A3E
debugTokenExpression.string#843400
debugTokenExpression.value#843400
debugToolBar.background#F2EDF7
debugToolBar.border#CBBED5
debugView.stateLabelForeground#5B2188
debugView.valueChangedHighlight#FEF9ED
descriptionForeground#5A486F
diffEditor.border#CBBED5
diffEditor.insertedTextBackground#EDFAF1CC
diffEditor.removedTextBackground#FDF2F7CC
disabledForeground#5A486FAA
dropdown.background#FAF8FD
dropdown.border#A38DB4
dropdown.foreground#1A0E26
editor.background#FAF8FD
editor.findMatchBackground#FEF9ED
editor.findMatchBorder#FDE1AB
editor.findMatchHighlightBackground#FEF9EDCC
editor.foreground#1A0E26
editor.hoverHighlightBackground#F2EDF7
editor.inactiveSelectionBackground#D8C2F280
editor.lineHighlightBackground#F2EDF777
editor.lineHighlightBorder#00000000
editor.selectionBackground#D8C2F2B3
editor.selectionHighlightBackground#D8C2F266
editor.selectionHighlightBorder#5B21884D
editor.wordHighlightBackground#5B21881A
editor.wordHighlightStrongBackground#5B21882E
editorActionList.background#FAF8FD
editorActionList.focusBackground#D9CDE2
editorActionList.focusForeground#1A0E26
editorActionList.foreground#1A0E26
editorAI.background#5B218815
editorAI.border#5B21884D
editorAI.foreground#5B2188
editorBracketHighlight.foreground1#5B2188
editorBracketHighlight.foreground2#0A5E36
editorBracketHighlight.foreground3#6A4400
editorBracketHighlight.foreground4#362465
editorBracketHighlight.foreground5#0A5E36
editorBracketHighlight.foreground6#843400
editorBracketMatch.background#D9CDE2
editorBracketMatch.border#5B2188
editorCursor.foreground#5B2188
editorError.foreground#910A3E
editorGhostText.background#00000000
editorGhostText.border#00000000
editorGhostText.foreground#5A486FCC
editorGroup.border#CBBED5
editorGroupHeader.noTabsBackground#FAF8FD
editorGroupHeader.tabsBackground#F2EDF7
editorGroupHeader.tabsBorder#CBBED5
editorHint.foreground#0A5E36
editorHoverWidget.background#FAF8FD
editorHoverWidget.border#A38DB4
editorHoverWidget.foreground#1A0E26
editorHoverWidget.statusBarBackground#F2EDF7
editorIndentGuide.activeBackground#5B2188
editorIndentGuide.activeBackground1#5B2188
editorIndentGuide.activeBackground2#0A5E36
editorIndentGuide.activeBackground3#6A4400
editorIndentGuide.activeBackground4#362465
editorIndentGuide.activeBackground5#0A5E36
editorIndentGuide.activeBackground6#843400
editorIndentGuide.background#CBBED5
editorIndentGuide.background1#5B218825
editorIndentGuide.background2#0A5E3625
editorIndentGuide.background3#6A440025
editorIndentGuide.background4#36246525
editorIndentGuide.background5#0A5E3625
editorIndentGuide.background6#84340025
editorInfo.foreground#5B2188
editorInlayHint.background#D9CDE299
editorInlayHint.foreground#5A486F
editorInlayHint.parameterForeground#6A4400
editorInlayHint.typeForeground#0A5E36
editorLineNumber.activeForeground#5B2188
editorLineNumber.foreground#5A486F99
editorLink.activeForeground#5B2188
editorStickyScroll.background#F2EDF7
editorStickyScroll.border#CBBED5
editorStickyScroll.shadow#00000014
editorStickyScrollHover.background#D9CDE2
editorSuggestWidget.background#FAF8FD
editorSuggestWidget.border#A38DB4
editorSuggestWidget.focusHighlightForeground#5B2188
editorSuggestWidget.foreground#1A0E26
editorSuggestWidget.highlightForeground#5B2188
editorSuggestWidget.selectedBackground#D9CDE2
editorSuggestWidget.selectedForeground#1A0E26
editorSuggestWidget.selectedIconForeground#5B2188
editorWarning.foreground#843400
editorWidget.background#FAF8FD
editorWidget.border#A38DB4
editorWidget.foreground#1A0E26
editorWidget.resizeBorder#5B2188
errorForeground#910A3E
focusBorder#5B2188
foreground#1A0E26
gitDecoration.addedResourceForeground#0A5E36
gitDecoration.conflictingResourceForeground#843400
gitDecoration.deletedResourceForeground#910A3E
gitDecoration.ignoredResourceForeground#5A486F88
gitDecoration.modifiedResourceForeground#6A4400
gitDecoration.untrackedResourceForeground#0A5E36
icon.foreground#1A0E26
inlineChat.background#FAF8FD
inlineChat.border#A38DB4
inlineChat.regionHighlight#5B21881A
inlineChat.shadow#00000022
inlineChatDiff.inserted#EDFAF1CC
inlineChatDiff.removed#FDF2F7CC
inlineChatInput.background#F2EDF7
inlineChatInput.border#CBBED5
inlineChatInput.focusBorder#5B2188
inlineChatInput.placeholderForeground#5A486F
inlineEdit.border#A38DB4
inlineEdit.indicator.background#5B2188
inlineEdit.indicator.border#401362
inlineEdit.indicator.foreground#FFFFFF
inlineEdit.modifiedBackground#EDFAF180
inlineEdit.originalBackground#FDF2F780
input.background#FAF8FD
input.border#A38DB4
input.foreground#1A0E26
input.placeholderForeground#5A486F
inputOption.activeBorder#5B2188
inputValidation.errorBackground#FDF2F7
inputValidation.errorBorder#910A3E
inputValidation.infoBackground#EDFAF1
inputValidation.infoBorder#0A5E36
inputValidation.warningBackground#FFF5EB
inputValidation.warningBorder#843400
interactive.activeCodeBorder#5B2188
interactive.inactiveCodeBorder#CBBED5
interactive.requestBorder#CBBED5
keybindingLabel.background#F2EDF7
keybindingLabel.border#A38DB4
keybindingLabel.bottomBorder#A38DB4
keybindingLabel.foreground#1A0E26
list.activeSelectionBackground#D9CDE2
list.activeSelectionForeground#1A0E26
list.activeSelectionIconForeground#5B2188
list.errorForeground#910A3E
list.focusBackground#D9CDE2
list.focusForeground#1A0E26
list.focusHighlightForeground#5B2188
list.highlightForeground#5B2188
list.hoverBackground#D9CDE266
list.hoverForeground#1A0E26
list.inactiveFocusBackground#D8C2F255
list.inactiveSelectionBackground#D8C2F277
list.inactiveSelectionForeground#1A0E26
list.inactiveSelectionIconForeground#5B2188
list.warningForeground#843400
menu.background#FAF8FD
menu.border#A38DB4
menu.foreground#1A0E26
menu.selectionBackground#D9CDE2
menu.selectionBorder#5B2188
menu.selectionForeground#1A0E26
menu.separatorBackground#CBBED5
menubar.selectionBackground#D9CDE2
menubar.selectionForeground#1A0E26
multiDiffEditor.background#FAF8FD
multiDiffEditor.border#CBBED5
multiDiffEditor.headerBackground#F2EDF7
notificationCenter.border#A38DB4
notifications.background#FAF8FD
notifications.border#CBBED5
notifications.foreground#1A0E26
notificationToast.border#A38DB4
outputView.background#FAF8FD
outputViewStickyScroll.background#F2EDF7
panel.background#EDE6F3
panel.border#CBBED5
panelSection.border#CBBED5
panelSection.dropBackground#D9CDE2
panelSectionHeader.background#F2EDF7
panelSectionHeader.border#CBBED5
panelSectionHeader.foreground#1A0E26
panelTitle.activeBorder#5B2188
panelTitle.activeForeground#1A0E26
panelTitle.inactiveForeground#5A486F
peekView.border#5B2188
peekViewEditor.background#F2EDF7
peekViewEditor.matchHighlightBackground#FEF9ED
peekViewResult.background#EDE6F3
peekViewResult.matchHighlightBackground#FEF9ED
peekViewResult.selectionBackground#D9CDE2
peekViewTitle.background#F2EDF7
problemsErrorIcon.foreground#910A3E
problemsInfoIcon.foreground#5B2188
problemsWarningIcon.foreground#843400
quickInput.background#FAF8FD
quickInput.foreground#1A0E26
quickInputList.focusBackground#D9CDE2
searchEditor.findMatchBackground#FEF9ED
searchEditor.findMatchBorder#FDE1AB
selection.background#D9CDE2
settings.focusedRowBackground#D9CDE250
settings.headerForeground#5B2188
settings.modifiedItemIndicator#5B2188
settings.rowHoverBackground#D9CDE225
sideBar.background#EDE6F3
sideBar.border#CBBED5
sideBar.foreground#1A0E26
sideBarSectionHeader.background#F2EDF7
sideBarSectionHeader.border#CBBED5
sideBarSectionHeader.foreground#1A0E26
sideBarTitle.foreground#5B2188
statusBar.background#5B2188
statusBar.border#5B2188
statusBar.debuggingBackground#FFF5EB
statusBar.debuggingForeground#843400
statusBar.foreground#FFFFFF
statusBar.noFolderBackground#5B2188
statusBar.noFolderForeground#FFFFFF
statusBarItem.hoverBackground#FFFFFF25
statusBarItem.remoteBackground#00000030
statusBarItem.remoteForeground#FFFFFF
symbolIcon.arrayForeground#1A0E26
symbolIcon.booleanForeground#910A3E
symbolIcon.classForeground#0A5E36
symbolIcon.colorForeground#910A3E
symbolIcon.constantForeground#6A4400
symbolIcon.eventForeground#362465
symbolIcon.fieldForeground#1A0E26
symbolIcon.fileForeground#1A0E26
symbolIcon.folderForeground#5B2188
symbolIcon.functionForeground#362465
symbolIcon.interfaceForeground#0A5E36
symbolIcon.keyForeground#5B2188
symbolIcon.keywordForeground#5B2188
symbolIcon.methodForeground#362465
symbolIcon.moduleForeground#5B2188
symbolIcon.nullForeground#6A4400
symbolIcon.numberForeground#910A3E
symbolIcon.objectForeground#0A5E36
symbolIcon.operatorForeground#1A0E26
symbolIcon.packageForeground#5B2188
symbolIcon.propertyForeground#1A0E26
symbolIcon.snippetForeground#5B2188
symbolIcon.stringForeground#843400
symbolIcon.structForeground#0A5E36
symbolIcon.textForeground#1A0E26
symbolIcon.typeParameterForeground#0A5E36
symbolIcon.unitForeground#6A4400
symbolIcon.variableForeground#1A0E26
tab.activeBackground#FAF8FD
tab.activeBorder#5B2188
tab.activeBorderTop#5B2188
tab.activeForeground#1A0E26
tab.border#CBBED5
tab.hoverBackground#FAF8FD
tab.hoverForeground#1A0E26
tab.inactiveBackground#F2EDF7
tab.inactiveForeground#5A486F
tab.unfocusedActiveBackground#FAF8FD
tab.unfocusedActiveForeground#1A0E26
tab.unfocusedInactiveForeground#5A486F
terminal.ansiBlack#1A0E26
terminal.ansiBlue#5B2188
terminal.ansiBrightBlack#5A486F
terminal.ansiBrightBlue#401362
terminal.ansiBrightCyan#0A5E36
terminal.ansiBrightGreen#0A5E36
terminal.ansiBrightMagenta#362465
terminal.ansiBrightRed#910A3E
terminal.ansiBrightWhite#1A0E26
terminal.ansiBrightYellow#6A4400
terminal.ansiCyan#0A5E36
terminal.ansiGreen#0A5E36
terminal.ansiMagenta#362465
terminal.ansiRed#910A3E
terminal.ansiWhite#F2EDF7
terminal.ansiYellow#6A4400
terminal.background#FAF8FD
terminal.border#CBBED5
terminal.findMatchBackground#FEF9ED
terminal.findMatchBorder#FDE1AB
terminal.findMatchHighlightBackground#FEF9EDCC
terminal.foreground#1A0E26
terminal.hoverHighlightBackground#F2EDF7
terminal.inactiveSelectionBackground#D8C2F255
terminal.selectionBackground#D8C2F2B3
terminal.tab.activeBorder#5B2188
terminalCommandDecoration.defaultBackground#5B218880
terminalCommandDecoration.errorBackground#910A3E
terminalCommandDecoration.successBackground#0A5E36
terminalCursor.background#FAF8FD
terminalCursor.foreground#5B2188
terminalOverviewRuler.cursorForeground#5B2188
terminalOverviewRuler.findMatchForeground#6A4400
titleBar.activeBackground#EDE6F3
titleBar.activeForeground#1A0E26
titleBar.border#CBBED5
titleBar.inactiveBackground#F2EDF7
titleBar.inactiveForeground#5A486F
walkThrough.embeddedEditorBackground#F2EDF7
welcomePage.background#FAF8FD
welcomePage.buttonBackground#F2EDF7
welcomePage.buttonHoverBackground#D9CDE2
widget.shadow#00000018

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment, comment.line, comment.line.double-slash, comment.line.triple-slash, comment.line.number-sign, comment.line.dashes, comment.line.character, comment.line.percentage, comment.block, comment.block.documentation, punctuation.definition.comment, string.comment, string.quoted.docstring, string.quoted.docstring.multi, string.quoted.docstring.multi.python, string.quoted.docstring.single.python, string.quoted.double.block.python, string.quoted.single.block.python, source.kotlin comment, source.kotlin comment.line, source.kotlin comment.block, source.kotlin comment.block.documentation, source.swift comment, source.go comment, source.rust comment, source.dart comment, source.java comment, source.ts comment, source.tsx comment, source.js comment, source.jsx comment, source.python comment, source.sql comment, source.shell comment, source.yaml comment	#5A486F	italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical, keyword.operator.delete, storage, storage.type, storage.modifier	#5B2188	bold
entity.name.function, support.function, meta.function-call, variable.function	#362465	—
entity.name.type, entity.name.class, entity.name.struct, entity.name.enum, entity.name.interface, support.class, support.type, entity.other.inherited-class	#0A5E36	bold
constant, constant.language, constant.numeric, support.constant	#6A4400	—
variable, variable.other, variable.other.readwrite, variable.other.property	#1A0E26	—
keyword.operator, punctuation, punctuation.accessor, punctuation.separator	#1A0E26	—
invalid, invalid.illegal, invalid.deprecated	#910A3E	bold underline
constant.other.color, constant.other.color.rgb-value, constant.other.uuid, support.constant.color, keyword.other.dotenv, source.env variable.other.key, source.dotenv variable.other.key	#910A3E	—
string.regexp, string.regexp constant.character.escape, constant.other.character-class.regexp	#910A3E	—
source.python string.quoted, source.js string.quoted, source.jsx string.quoted, source.ts string.quoted, source.tsx string.quoted, source.rust string.quoted, source.go string.quoted, source.kotlin string.quoted, source.swift string.quoted, source.dart string.quoted, source.sql string.quoted	#843400	—
source.js string.template, source.ts string.template, source.tsx string.template, source.python string.interpolated	#843400	—
source.python variable.parameter, source.js variable.parameter, source.jsx variable.parameter, source.ts variable.parameter, source.tsx variable.parameter, source.rust variable.parameter, source.go variable.parameter, source.kotlin variable.parameter, source.swift variable.parameter, source.dart variable.parameter	#6A4400	—
source.ts entity.name.type, source.tsx entity.name.type, source.rust entity.name.type, source.go entity.name.type, source.kotlin entity.name.type, source.swift entity.name.type, source.dart entity.name.type, source.python entity.name.type.class	#0A5E36	bold
source.python entity.name.function.decorator, source.python variable.language.special.self, source.python variable.language.special.cls	#401362	italic
source.python support.function.magic	#362465	bold
source.jsx entity.name.tag, source.tsx entity.name.tag, source.jsx support.class.component, source.tsx support.class.component	#0A5E36	bold
source.jsx entity.other.attribute-name, source.tsx entity.other.attribute-name	#6A4400	—
source.sql keyword.other.DML, source.sql keyword.other.DDL, source.sql keyword.other.order, source.sql keyword.other.create	#5B2188	bold
source.sql constant.other.database-name, source.sql constant.other.table-name	#0A5E36	—
source.rust storage.modifier.lifetime, source.rust entity.name.function.macro	#362465	bold
source.go entity.name.package, source.go keyword.channel	#5B2188	bold
source.kotlin storage.type.annotation, source.swift storage.type.annotation, source.swift keyword.other.declaration-specifier	#362465	—
source.dart storage.type.annotation, source.dart support.class.flutter	#0A5E36	bold
source.json support.type.property-name	#0A5E36	bold
source.yaml entity.name.tag	#0A5E36	bold
source.toml entity.other.attribute-name.table, source.toml keyword.key	#0A5E36	bold
source.ini entity.name.section, source.ini keyword.other.definition	#0A5E36	bold
source.env variable.other.key, source.dotenv variable.other.key, source.env keyword.other	#910A3E	bold
text.html.markdown, text.plain, meta.paragraph.markdown	#1A0E26	—
text.html.markdown markup.heading, text.html.markdown entity.name.section, text.html.markdown punctuation.definition.heading	#5B2188	bold
text.html.markdown markup.inline.raw, text.html.markdown markup.fenced_code	#0A5E36	—
text.html.markdown markup.underline.link, text.html.markdown string.other.link	#5B2188	underline
text.html.markdown markup.quote	#5A486F	italic
text.html entity.name.tag, text.xml entity.name.tag	#5B2188	bold
text.html entity.other.attribute-name, text.xml entity.other.attribute-name	#362465	—
log.error, log.fatal, log.critical, log.exception	#910A3E	bold
log.warning, log.warn	#843400	bold
log.info, log.notice	#0A5E36	bold
log.debug, log.trace	#6A4400	—
log.date, log.timestamp	#5A486F	—

VS Code preview

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

ZeroToSaaS Accessibility Theme Suite — ZeroToSaaS Terracotta Night (Orange)

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#E9875D
activityBar.background#1D1814
activityBar.border#302D2A
activityBar.foreground#E9875D
activityBar.inactiveForeground#A89A93
activityBarBadge.background#E9875D
activityBarBadge.foreground#FFFFFF
badge.background#E9875D
badge.foreground#FFFFFF
breadcrumb.activeSelectionForeground#E9875D
breadcrumb.background#110C08
breadcrumb.focusForeground#F1E5DF
breadcrumb.foreground#A89A93
button.background#E9875D
button.foreground#FFFFFF
button.hoverBackground#F2A07D
button.secondaryBackground#16120D
button.secondaryForeground#F1E5DF
button.secondaryHoverBackground#211F1C
chat.avatarBackground#E9875D
chat.avatarForeground#FFFFFF
chat.linesAddedForeground#7AC189
chat.linesRemovedForeground#FF7965
chat.requestBackground#16120D
chat.requestBorder#302D2A
chat.slashCommandBackground#E9875D1A
chat.slashCommandForeground#E9875D
commandCenter.activeBackground#211F1C
commandCenter.activeBorder#E9875D
commandCenter.activeForeground#F1E5DF
commandCenter.background#16120D
commandCenter.border#302D2A
commandCenter.foreground#F1E5DF
commandCenter.inactiveBorder#302D2A
commandCenter.inactiveForeground#A89A93
debugConsole.background#110C08
debugConsole.errorForeground#FF7965
debugConsole.foreground#F1E5DF
debugConsole.infoForeground#7AC189
debugConsole.sourceForeground#A89A93
debugConsole.warningForeground#F39166
debugConsoleInputIcon.foreground#E9875D
debugIcon.breakpointCurrentStackframeForeground#E6A976
debugIcon.breakpointDisabledForeground#A89A9380
debugIcon.breakpointForeground#FF7965
debugIcon.breakpointStackframeForeground#7AC189
debugIcon.breakpointUnverifiedForeground#F39166
debugIcon.continueForeground#7AC189
debugIcon.disconnectForeground#FF7965
debugIcon.pauseForeground#E6A976
debugIcon.restartForeground#7AC189
debugIcon.startForeground#7AC189
debugIcon.stepBackForeground#E9875D
debugIcon.stepIntoForeground#E9875D
debugIcon.stepOutForeground#E9875D
debugIcon.stepOverForeground#E9875D
debugIcon.stopForeground#FF7965
debugTokenExpression.boolean#E28C60
debugTokenExpression.error#FF7965
debugTokenExpression.name#FBDECD
debugTokenExpression.number#FB7662
debugTokenExpression.string#E6895D
debugTokenExpression.value#E6895D
debugToolBar.background#16120D
debugToolBar.border#302D2A
debugView.stateLabelForeground#E9875D
debugView.valueChangedHighlight#1F1A12
descriptionForeground#A89A93
diffEditor.border#302D2A
diffEditor.insertedTextBackground#121814CC
diffEditor.removedTextBackground#1C1412CC
disabledForeground#A89A93AA
dropdown.background#110C08
dropdown.border#45423F
dropdown.foreground#F1E5DF
editor.background#110C08
editor.findMatchBackground#1F1A12
editor.findMatchBorder#E6A976
editor.findMatchHighlightBackground#1F1A12CC
editor.foreground#F1E5DF
editor.hoverHighlightBackground#16120D
editor.inactiveSelectionBackground#5E000080
editor.lineHighlightBackground#16120D77
editor.lineHighlightBorder#00000000
editor.selectionBackground#5E0000B3
editor.selectionHighlightBackground#5E000066
editor.selectionHighlightBorder#E9875D4D
editor.wordHighlightBackground#E9875D1A
editor.wordHighlightStrongBackground#E9875D2E
editorActionList.background#110C08
editorActionList.focusBackground#211F1C
editorActionList.focusForeground#F1E5DF
editorActionList.foreground#F1E5DF
editorAI.background#E9875D15
editorAI.border#E9875D4D
editorAI.foreground#E9875D
editorBracketHighlight.foreground1#E9875D
editorBracketHighlight.foreground2#7AC189
editorBracketHighlight.foreground3#E6A976
editorBracketHighlight.foreground4#E38A69
editorBracketHighlight.foreground5#71B87F
editorBracketHighlight.foreground6#F39166
editorBracketMatch.background#211F1C
editorBracketMatch.border#E9875D
editorCursor.foreground#E9875D
editorError.foreground#FF7965
editorGhostText.background#00000000
editorGhostText.border#00000000
editorGhostText.foreground#A89A93CC
editorGroup.border#302D2A
editorGroupHeader.noTabsBackground#110C08
editorGroupHeader.tabsBackground#16120D
editorGroupHeader.tabsBorder#302D2A
editorHint.foreground#7AC189
editorHoverWidget.background#110C08
editorHoverWidget.border#45423F
editorHoverWidget.foreground#F1E5DF
editorHoverWidget.statusBarBackground#16120D
editorIndentGuide.activeBackground#E9875D
editorIndentGuide.activeBackground1#E9875D
editorIndentGuide.activeBackground2#7AC189
editorIndentGuide.activeBackground3#E6A976
editorIndentGuide.activeBackground4#E38A69
editorIndentGuide.activeBackground5#71B87F
editorIndentGuide.activeBackground6#F39166
editorIndentGuide.background#302D2A
editorIndentGuide.background1#E9875D25
editorIndentGuide.background2#7AC18925
editorIndentGuide.background3#E6A97625
editorIndentGuide.background4#E38A6925
editorIndentGuide.background5#71B87F25
editorIndentGuide.background6#F3916625
editorInfo.foreground#E9875D
editorInlayHint.background#211F1C99
editorInlayHint.foreground#A89A93
editorInlayHint.parameterForeground#DD8F62
editorInlayHint.typeForeground#71B87F
editorLineNumber.activeForeground#E9875D
editorLineNumber.foreground#A89A9399
editorLink.activeForeground#E9875D
editorStickyScroll.background#16120D
editorStickyScroll.border#302D2A
editorStickyScroll.shadow#00000044
editorStickyScrollHover.background#211F1C
editorSuggestWidget.background#110C08
editorSuggestWidget.border#45423F
editorSuggestWidget.focusHighlightForeground#E9875D
editorSuggestWidget.foreground#F1E5DF
editorSuggestWidget.highlightForeground#E9875D
editorSuggestWidget.selectedBackground#211F1C
editorSuggestWidget.selectedForeground#F1E5DF
editorSuggestWidget.selectedIconForeground#E9875D
editorWarning.foreground#F39166
editorWidget.background#110C08
editorWidget.border#45423F
editorWidget.foreground#F1E5DF
editorWidget.resizeBorder#E9875D
errorForeground#FF7965
focusBorder#E9875D
foreground#F1E5DF
gitDecoration.addedResourceForeground#7AC189
gitDecoration.conflictingResourceForeground#F39166
gitDecoration.deletedResourceForeground#FF7965
gitDecoration.ignoredResourceForeground#A89A9388
gitDecoration.modifiedResourceForeground#E6A976
gitDecoration.untrackedResourceForeground#7AC189
icon.foreground#F1E5DF
inlineChat.background#110C08
inlineChat.border#45423F
inlineChat.regionHighlight#E9875D1A
inlineChat.shadow#00000055
inlineChatDiff.inserted#121814CC
inlineChatDiff.removed#1C1412CC
inlineChatInput.background#16120D
inlineChatInput.border#302D2A
inlineChatInput.focusBorder#E9875D
inlineChatInput.placeholderForeground#A89A93
inlineEdit.border#45423F
inlineEdit.indicator.background#E9875D
inlineEdit.indicator.border#F2A07D
inlineEdit.indicator.foreground#FFFFFF
inlineEdit.modifiedBackground#12181480
inlineEdit.originalBackground#1C141280
input.background#110C08
input.border#45423F
input.foreground#F1E5DF
input.placeholderForeground#A89A93
inputOption.activeBorder#E9875D
inputValidation.errorBackground#1C1412
inputValidation.errorBorder#FF7965
inputValidation.infoBackground#121814
inputValidation.infoBorder#7AC189
inputValidation.warningBackground#1C140E
inputValidation.warningBorder#F39166
interactive.activeCodeBorder#E9875D
interactive.inactiveCodeBorder#302D2A
interactive.requestBorder#302D2A
keybindingLabel.background#16120D
keybindingLabel.border#45423F
keybindingLabel.bottomBorder#45423F
keybindingLabel.foreground#F1E5DF
list.activeSelectionBackground#211F1C
list.activeSelectionForeground#F1E5DF
list.activeSelectionIconForeground#E9875D
list.errorForeground#FF7965
list.focusBackground#211F1C
list.focusForeground#F1E5DF
list.focusHighlightForeground#E9875D
list.highlightForeground#E9875D
list.hoverBackground#211F1C66
list.hoverForeground#F1E5DF
list.inactiveFocusBackground#5E000055
list.inactiveSelectionBackground#5E000077
list.inactiveSelectionForeground#F1E5DF
list.inactiveSelectionIconForeground#E9875D
list.warningForeground#F39166
menu.background#110C08
menu.border#45423F
menu.foreground#F1E5DF
menu.selectionBackground#211F1C
menu.selectionBorder#E9875D
menu.selectionForeground#F1E5DF
menu.separatorBackground#302D2A
menubar.selectionBackground#211F1C
menubar.selectionForeground#F1E5DF
multiDiffEditor.background#110C08
multiDiffEditor.border#302D2A
multiDiffEditor.headerBackground#16120D
notificationCenter.border#45423F
notifications.background#110C08
notifications.border#302D2A
notifications.foreground#F1E5DF
notificationToast.border#45423F
outputView.background#110C08
outputViewStickyScroll.background#16120D
panel.background#1A1510
panel.border#302D2A
panelSection.border#302D2A
panelSection.dropBackground#211F1C
panelSectionHeader.background#16120D
panelSectionHeader.border#302D2A
panelSectionHeader.foreground#F1E5DF
panelTitle.activeBorder#E9875D
panelTitle.activeForeground#F1E5DF
panelTitle.inactiveForeground#A89A93
peekView.border#E9875D
peekViewEditor.background#16120D
peekViewEditor.matchHighlightBackground#1F1A12
peekViewResult.background#1A1510
peekViewResult.matchHighlightBackground#1F1A12
peekViewResult.selectionBackground#211F1C
peekViewTitle.background#16120D
problemsErrorIcon.foreground#FF7965
problemsInfoIcon.foreground#E9875D
problemsWarningIcon.foreground#F39166
quickInput.background#110C08
quickInput.foreground#F1E5DF
quickInputList.focusBackground#211F1C
searchEditor.findMatchBackground#1F1A12
searchEditor.findMatchBorder#E6A976
selection.background#211F1C
settings.focusedRowBackground#211F1C50
settings.headerForeground#E9875D
settings.modifiedItemIndicator#E9875D
settings.rowHoverBackground#211F1C25
sideBar.background#1A1510
sideBar.border#302D2A
sideBar.foreground#F1E5DF
sideBarSectionHeader.background#16120D
sideBarSectionHeader.border#302D2A
sideBarSectionHeader.foreground#F1E5DF
sideBarTitle.foreground#E9875D
statusBar.background#590000
statusBar.border#590000
statusBar.debuggingBackground#1C140E
statusBar.debuggingForeground#F39166
statusBar.foreground#FFFFFF
statusBar.noFolderBackground#590000
statusBar.noFolderForeground#FFFFFF
statusBarItem.hoverBackground#FFFFFF25
statusBarItem.remoteBackground#00000030
statusBarItem.remoteForeground#FFFFFF
symbolIcon.arrayForeground#FBDECD
symbolIcon.booleanForeground#FB7662
symbolIcon.classForeground#71B87F
symbolIcon.colorForeground#FB7662
symbolIcon.constantForeground#E28C60
symbolIcon.eventForeground#E38A69
symbolIcon.fieldForeground#FBDECD
symbolIcon.fileForeground#F1E5DF
symbolIcon.folderForeground#E9875D
symbolIcon.functionForeground#E38A69
symbolIcon.interfaceForeground#71B87F
symbolIcon.keyForeground#EA865C
symbolIcon.keywordForeground#EA865C
symbolIcon.methodForeground#E38A69
symbolIcon.moduleForeground#E9875D
symbolIcon.nullForeground#E28C60
symbolIcon.numberForeground#FB7662
symbolIcon.objectForeground#71B87F
symbolIcon.operatorForeground#FBDECD
symbolIcon.packageForeground#E9875D
symbolIcon.propertyForeground#FBDECD
symbolIcon.snippetForeground#E9875D
symbolIcon.stringForeground#E6895D
symbolIcon.structForeground#71B87F
symbolIcon.textForeground#F1E5DF
symbolIcon.typeParameterForeground#71B87F
symbolIcon.unitForeground#E28C60
symbolIcon.variableForeground#FBDECD
tab.activeBackground#110C08
tab.activeBorder#E9875D
tab.activeBorderTop#E9875D
tab.activeForeground#F1E5DF
tab.border#302D2A
tab.hoverBackground#110C08
tab.hoverForeground#F1E5DF
tab.inactiveBackground#16120D
tab.inactiveForeground#A89A93
tab.unfocusedActiveBackground#110C08
tab.unfocusedActiveForeground#F1E5DF
tab.unfocusedInactiveForeground#A89A93
terminal.ansiBlack#16120D
terminal.ansiBlue#E9875D
terminal.ansiBrightBlack#1A1510
terminal.ansiBrightBlue#F2A07D
terminal.ansiBrightCyan#71B87F
terminal.ansiBrightGreen#7AC189
terminal.ansiBrightMagenta#E38A69
terminal.ansiBrightRed#FF7965
terminal.ansiBrightWhite#FFFFFF
terminal.ansiBrightYellow#E6A976
terminal.ansiCyan#71B87F
terminal.ansiGreen#7AC189
terminal.ansiMagenta#E38A69
terminal.ansiRed#FF7965
terminal.ansiWhite#F1E5DF
terminal.ansiYellow#E6A976
terminal.background#110C08
terminal.border#302D2A
terminal.findMatchBackground#1F1A12
terminal.findMatchBorder#E6A976
terminal.findMatchHighlightBackground#1F1A12CC
terminal.foreground#F1E5DF
terminal.hoverHighlightBackground#16120D
terminal.inactiveSelectionBackground#5E000055
terminal.selectionBackground#5E0000B3
terminal.tab.activeBorder#E9875D
terminalCommandDecoration.defaultBackground#E9875D80
terminalCommandDecoration.errorBackground#FF7965
terminalCommandDecoration.successBackground#7AC189
terminalCursor.background#110C08
terminalCursor.foreground#E9875D
terminalOverviewRuler.cursorForeground#E9875D
terminalOverviewRuler.findMatchForeground#E6A976
titleBar.activeBackground#1A1510
titleBar.activeForeground#F1E5DF
titleBar.border#302D2A
titleBar.inactiveBackground#16120D
titleBar.inactiveForeground#A89A93
walkThrough.embeddedEditorBackground#16120D
welcomePage.background#110C08
welcomePage.buttonBackground#16120D
welcomePage.buttonHoverBackground#211F1C
widget.shadow#00000066

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment, comment.line, comment.line.double-slash, comment.line.triple-slash, comment.line.number-sign, comment.line.dashes, comment.line.character, comment.line.percentage, comment.block, comment.block.documentation, punctuation.definition.comment, string.comment, string.quoted.docstring, string.quoted.docstring.multi, string.quoted.docstring.multi.python, string.quoted.docstring.single.python, string.quoted.double.block.python, string.quoted.single.block.python, source.kotlin comment, source.kotlin comment.line, source.kotlin comment.block, source.kotlin comment.block.documentation, source.swift comment, source.go comment, source.rust comment, source.dart comment, source.java comment, source.ts comment, source.tsx comment, source.js comment, source.jsx comment, source.python comment, source.sql comment, source.shell comment, source.yaml comment	#C29B88	italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical, keyword.operator.delete, storage, storage.type, storage.modifier	#EA865C	bold
entity.name.function, support.function, meta.function-call, variable.function	#E38A69	—
entity.name.type, entity.name.class, entity.name.struct, entity.name.enum, entity.name.interface, support.class, support.type, entity.other.inherited-class	#71B87F	bold
constant, constant.language, constant.numeric, support.constant	#E28C60	—
variable, variable.other, variable.other.readwrite, variable.other.property	#FBDECD	—
keyword.operator, punctuation, punctuation.accessor, punctuation.separator	#FBDECD	—
invalid, invalid.illegal, invalid.deprecated	#FF7965	bold underline
constant.other.color, constant.other.color.rgb-value, constant.other.uuid, support.constant.color, keyword.other.dotenv, source.env variable.other.key, source.dotenv variable.other.key	#FF7965	—
string.regexp, string.regexp constant.character.escape, constant.other.character-class.regexp	#FF7965	—
source.python string.quoted, source.js string.quoted, source.jsx string.quoted, source.ts string.quoted, source.tsx string.quoted, source.rust string.quoted, source.go string.quoted, source.kotlin string.quoted, source.swift string.quoted, source.dart string.quoted, source.sql string.quoted	#F39166	—
source.js string.template, source.ts string.template, source.tsx string.template, source.python string.interpolated	#F39166	—
source.python variable.parameter, source.js variable.parameter, source.jsx variable.parameter, source.ts variable.parameter, source.tsx variable.parameter, source.rust variable.parameter, source.go variable.parameter, source.kotlin variable.parameter, source.swift variable.parameter, source.dart variable.parameter	#E6A976	—
source.ts entity.name.type, source.tsx entity.name.type, source.rust entity.name.type, source.go entity.name.type, source.kotlin entity.name.type, source.swift entity.name.type, source.dart entity.name.type, source.python entity.name.type.class	#7AC189	bold
source.python entity.name.function.decorator, source.python variable.language.special.self, source.python variable.language.special.cls	#F2A07D	italic
source.python support.function.magic	#E38A69	bold
source.jsx entity.name.tag, source.tsx entity.name.tag, source.jsx support.class.component, source.tsx support.class.component	#7AC189	bold
source.jsx entity.other.attribute-name, source.tsx entity.other.attribute-name	#E6A976	—
source.sql keyword.other.DML, source.sql keyword.other.DDL, source.sql keyword.other.order, source.sql keyword.other.create	#EA865C	bold
source.sql constant.other.database-name, source.sql constant.other.table-name	#71B87F	—
source.rust storage.modifier.lifetime, source.rust entity.name.function.macro	#E38A69	bold
source.go entity.name.package, source.go keyword.channel	#EA865C	bold
source.kotlin storage.type.annotation, source.swift storage.type.annotation, source.swift keyword.other.declaration-specifier	#E38A69	—
source.dart storage.type.annotation, source.dart support.class.flutter	#7AC189	bold
source.json support.type.property-name	#7AC189	bold
source.yaml entity.name.tag	#7AC189	bold
source.toml entity.other.attribute-name.table, source.toml keyword.key	#7AC189	bold
source.ini entity.name.section, source.ini keyword.other.definition	#7AC189	bold
source.env variable.other.key, source.dotenv variable.other.key, source.env keyword.other	#FF7965	bold
text.html.markdown, text.plain, meta.paragraph.markdown	#F1E5DF	—
text.html.markdown markup.heading, text.html.markdown entity.name.section, text.html.markdown punctuation.definition.heading	#EA865C	bold
text.html.markdown markup.inline.raw, text.html.markdown markup.fenced_code	#7AC189	—
text.html.markdown markup.underline.link, text.html.markdown string.other.link	#E9875D	underline
text.html.markdown markup.quote	#C29B88	italic
text.html entity.name.tag, text.xml entity.name.tag	#EA865C	bold
text.html entity.other.attribute-name, text.xml entity.other.attribute-name	#E38A69	—
log.error, log.fatal, log.critical, log.exception	#FF7965	bold
log.warning, log.warn	#F39166	bold
log.info, log.notice	#7AC189	bold
log.debug, log.trace	#E6A976	—
log.date, log.timestamp	#A89A93	—

VS Code preview

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

ZeroToSaaS Accessibility Theme Suite — ZeroToSaaS Terracotta (Orange)

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#8F3500
activityBar.background#EBE0D3
activityBar.border#D0B296
activityBar.foreground#8F3500
activityBar.inactiveForeground#6A4633
activityBarBadge.background#8F3500
activityBarBadge.foreground#FFFFFF
badge.background#8F3500
badge.foreground#FFFFFF
breadcrumb.activeSelectionForeground#8F3500
breadcrumb.background#FCF8F4
breadcrumb.focusForeground#261206
breadcrumb.foreground#6A4633
button.background#8F3500
button.foreground#FFFFFF
button.hoverBackground#6E2800
button.secondaryBackground#F6ECE4
button.secondaryForeground#261206
button.secondaryHoverBackground#DECBB9
chat.avatarBackground#8F3500
chat.avatarForeground#FFFFFF
chat.linesAddedForeground#16612E
chat.linesRemovedForeground#961103
chat.requestBackground#F6ECE4
chat.requestBorder#D0B296
chat.slashCommandBackground#8F35001A
chat.slashCommandForeground#8F3500
commandCenter.activeBackground#DECBB9
commandCenter.activeBorder#8F3500
commandCenter.activeForeground#261206
commandCenter.background#F6ECE4
commandCenter.border#D0B296
commandCenter.foreground#261206
commandCenter.inactiveBorder#D0B296
commandCenter.inactiveForeground#6A4633
debugConsole.background#FCF8F4
debugConsole.errorForeground#961103
debugConsole.foreground#261206
debugConsole.infoForeground#16612E
debugConsole.sourceForeground#6A4633
debugConsole.warningForeground#8F3600
debugConsoleInputIcon.foreground#8F3500
debugIcon.breakpointCurrentStackframeForeground#733E00
debugIcon.breakpointDisabledForeground#6A463380
debugIcon.breakpointForeground#961103
debugIcon.breakpointStackframeForeground#16612E
debugIcon.breakpointUnverifiedForeground#8F3600
debugIcon.continueForeground#16612E
debugIcon.disconnectForeground#961103
debugIcon.pauseForeground#733E00
debugIcon.restartForeground#16612E
debugIcon.startForeground#16612E
debugIcon.stepBackForeground#8F3500
debugIcon.stepIntoForeground#8F3500
debugIcon.stepOutForeground#8F3500
debugIcon.stepOverForeground#8F3500
debugIcon.stopForeground#961103
debugTokenExpression.boolean#853700
debugTokenExpression.error#961103
debugTokenExpression.name#261206
debugTokenExpression.number#961103
debugTokenExpression.string#8C3800
debugTokenExpression.value#8C3800
debugToolBar.background#F6ECE4
debugToolBar.border#D0B296
debugView.stateLabelForeground#8F3500
debugView.valueChangedHighlight#FEF7EC
descriptionForeground#6A4633
diffEditor.border#D0B296
diffEditor.insertedTextBackground#F2FAF4CC
diffEditor.removedTextBackground#FEF1EFCC
disabledForeground#6A4633AA
dropdown.background#FCF8F4
dropdown.border#AB825E
dropdown.foreground#261206
editor.background#FCF8F4
editor.findMatchBackground#FEF7EC
editor.findMatchBorder#FDDDA2
editor.findMatchHighlightBackground#FEF7ECCC
editor.foreground#261206
editor.hoverHighlightBackground#F6ECE4
editor.inactiveSelectionBackground#ECC6A580
editor.lineHighlightBackground#F6ECE477
editor.lineHighlightBorder#00000000
editor.selectionBackground#ECC6A5B3
editor.selectionHighlightBackground#ECC6A566
editor.selectionHighlightBorder#8F35004D
editor.wordHighlightBackground#8F35001A
editor.wordHighlightStrongBackground#8F35002E
editorActionList.background#FCF8F4
editorActionList.focusBackground#DECBB9
editorActionList.focusForeground#261206
editorActionList.foreground#261206
editorAI.background#8F350015
editorAI.border#8F35004D
editorAI.foreground#8F3500
editorBracketHighlight.foreground1#8F3500
editorBracketHighlight.foreground2#16612E
editorBracketHighlight.foreground3#733E00
editorBracketHighlight.foreground4#7A2B06
editorBracketHighlight.foreground5#16612E
editorBracketHighlight.foreground6#8F3600
editorBracketMatch.background#DECBB9
editorBracketMatch.border#8F3500
editorCursor.foreground#8F3500
editorError.foreground#961103
editorGhostText.background#00000000
editorGhostText.border#00000000
editorGhostText.foreground#6A4633CC
editorGroup.border#D0B296
editorGroupHeader.noTabsBackground#FCF8F4
editorGroupHeader.tabsBackground#F6ECE4
editorGroupHeader.tabsBorder#D0B296
editorHint.foreground#16612E
editorHoverWidget.background#FCF8F4
editorHoverWidget.border#AB825E
editorHoverWidget.foreground#261206
editorHoverWidget.statusBarBackground#F6ECE4
editorIndentGuide.activeBackground#8F3500
editorIndentGuide.activeBackground1#8F3500
editorIndentGuide.activeBackground2#16612E
editorIndentGuide.activeBackground3#733E00
editorIndentGuide.activeBackground4#7A2B06
editorIndentGuide.activeBackground5#16612E
editorIndentGuide.activeBackground6#8F3600
editorIndentGuide.background#D0B296
editorIndentGuide.background1#8F350025
editorIndentGuide.background2#16612E25
editorIndentGuide.background3#733E0025
editorIndentGuide.background4#7A2B0625
editorIndentGuide.background5#16612E25
editorIndentGuide.background6#8F360025
editorInfo.foreground#8F3500
editorInlayHint.background#DECBB999
editorInlayHint.foreground#6A4633
editorInlayHint.parameterForeground#7D3800
editorInlayHint.typeForeground#16612E
editorLineNumber.activeForeground#8F3500
editorLineNumber.foreground#6A463399
editorLink.activeForeground#8F3500
editorStickyScroll.background#F6ECE4
editorStickyScroll.border#D0B296
editorStickyScroll.shadow#00000014
editorStickyScrollHover.background#DECBB9
editorSuggestWidget.background#FCF8F4
editorSuggestWidget.border#AB825E
editorSuggestWidget.focusHighlightForeground#8F3500
editorSuggestWidget.foreground#261206
editorSuggestWidget.highlightForeground#8F3500
editorSuggestWidget.selectedBackground#DECBB9
editorSuggestWidget.selectedForeground#261206
editorSuggestWidget.selectedIconForeground#8F3500
editorWarning.foreground#8F3600
editorWidget.background#FCF8F4
editorWidget.border#AB825E
editorWidget.foreground#261206
editorWidget.resizeBorder#8F3500
errorForeground#961103
focusBorder#8F3500
foreground#261206
gitDecoration.addedResourceForeground#16612E
gitDecoration.conflictingResourceForeground#8F3600
gitDecoration.deletedResourceForeground#961103
gitDecoration.ignoredResourceForeground#6A463388
gitDecoration.modifiedResourceForeground#733E00
gitDecoration.untrackedResourceForeground#16612E
icon.foreground#261206
inlineChat.background#FCF8F4
inlineChat.border#AB825E
inlineChat.regionHighlight#8F35001A
inlineChat.shadow#00000022
inlineChatDiff.inserted#F2FAF4CC
inlineChatDiff.removed#FEF1EFCC
inlineChatInput.background#F6ECE4
inlineChatInput.border#D0B296
inlineChatInput.focusBorder#8F3500
inlineChatInput.placeholderForeground#6A4633
inlineEdit.border#AB825E
inlineEdit.indicator.background#8F3500
inlineEdit.indicator.border#6E2800
inlineEdit.indicator.foreground#FFFFFF
inlineEdit.modifiedBackground#F2FAF480
inlineEdit.originalBackground#FEF1EF80
input.background#FCF8F4
input.border#AB825E
input.foreground#261206
input.placeholderForeground#6A4633
inputOption.activeBorder#8F3500
inputValidation.errorBackground#FEF1EF
inputValidation.errorBorder#961103
inputValidation.infoBackground#F2FAF4
inputValidation.infoBorder#16612E
inputValidation.warningBackground#FFF4EB
inputValidation.warningBorder#8F3600
interactive.activeCodeBorder#8F3500
interactive.inactiveCodeBorder#D0B296
interactive.requestBorder#D0B296
keybindingLabel.background#F6ECE4
keybindingLabel.border#AB825E
keybindingLabel.bottomBorder#AB825E
keybindingLabel.foreground#261206
list.activeSelectionBackground#DECBB9
list.activeSelectionForeground#261206
list.activeSelectionIconForeground#8F3500
list.errorForeground#961103
list.focusBackground#DECBB9
list.focusForeground#261206
list.focusHighlightForeground#8F3500
list.highlightForeground#8F3500
list.hoverBackground#DECBB966
list.hoverForeground#261206
list.inactiveFocusBackground#ECC6A555
list.inactiveSelectionBackground#ECC6A577
list.inactiveSelectionForeground#261206
list.inactiveSelectionIconForeground#8F3500
list.warningForeground#8F3600
menu.background#FCF8F4
menu.border#AB825E
menu.foreground#261206
menu.selectionBackground#DECBB9
menu.selectionBorder#8F3500
menu.selectionForeground#261206
menu.separatorBackground#D0B296
menubar.selectionBackground#DECBB9
menubar.selectionForeground#261206
multiDiffEditor.background#FCF8F4
multiDiffEditor.border#D0B296
multiDiffEditor.headerBackground#F6ECE4
notificationCenter.border#AB825E
notifications.background#FCF8F4
notifications.border#D0B296
notifications.foreground#261206
notificationToast.border#AB825E
outputView.background#FCF8F4
outputViewStickyScroll.background#F6ECE4
panel.background#F3E7DC
panel.border#D0B296
panelSection.border#D0B296
panelSection.dropBackground#DECBB9
panelSectionHeader.background#F6ECE4
panelSectionHeader.border#D0B296
panelSectionHeader.foreground#261206
panelTitle.activeBorder#8F3500
panelTitle.activeForeground#261206
panelTitle.inactiveForeground#6A4633
peekView.border#8F3500
peekViewEditor.background#F6ECE4
peekViewEditor.matchHighlightBackground#FEF7EC
peekViewResult.background#F3E7DC
peekViewResult.matchHighlightBackground#FEF7EC
peekViewResult.selectionBackground#DECBB9
peekViewTitle.background#F6ECE4
problemsErrorIcon.foreground#961103
problemsInfoIcon.foreground#8F3500
problemsWarningIcon.foreground#8F3600
quickInput.background#FCF8F4
quickInput.foreground#261206
quickInputList.focusBackground#DECBB9
searchEditor.findMatchBackground#FEF7EC
searchEditor.findMatchBorder#FDDDA2
selection.background#DECBB9
settings.focusedRowBackground#DECBB950
settings.headerForeground#8F3500
settings.modifiedItemIndicator#8F3500
settings.rowHoverBackground#DECBB925
sideBar.background#F3E7DC
sideBar.border#D0B296
sideBar.foreground#261206
sideBarSectionHeader.background#F6ECE4
sideBarSectionHeader.border#D0B296
sideBarSectionHeader.foreground#261206
sideBarTitle.foreground#8F3500
statusBar.background#943800
statusBar.border#943800
statusBar.debuggingBackground#FFF4EB
statusBar.debuggingForeground#8F3600
statusBar.foreground#FFFFFF
statusBar.noFolderBackground#943800
statusBar.noFolderForeground#FFFFFF
statusBarItem.hoverBackground#FFFFFF25
statusBarItem.remoteBackground#00000030
statusBarItem.remoteForeground#FFFFFF
symbolIcon.arrayForeground#261206
symbolIcon.booleanForeground#961103
symbolIcon.classForeground#16612E
symbolIcon.colorForeground#961103
symbolIcon.constantForeground#853700
symbolIcon.eventForeground#7A2B06
symbolIcon.fieldForeground#261206
symbolIcon.fileForeground#261206
symbolIcon.folderForeground#8F3500
symbolIcon.functionForeground#7A2B06
symbolIcon.interfaceForeground#16612E
symbolIcon.keyForeground#913600
symbolIcon.keywordForeground#913600
symbolIcon.methodForeground#7A2B06
symbolIcon.moduleForeground#8F3500
symbolIcon.nullForeground#853700
symbolIcon.numberForeground#961103
symbolIcon.objectForeground#16612E
symbolIcon.operatorForeground#261206
symbolIcon.packageForeground#8F3500
symbolIcon.propertyForeground#261206
symbolIcon.snippetForeground#8F3500
symbolIcon.stringForeground#8C3800
symbolIcon.structForeground#16612E
symbolIcon.textForeground#261206
symbolIcon.typeParameterForeground#16612E
symbolIcon.unitForeground#853700
symbolIcon.variableForeground#261206
tab.activeBackground#FCF8F4
tab.activeBorder#8F3500
tab.activeBorderTop#8F3500
tab.activeForeground#261206
tab.border#D0B296
tab.hoverBackground#FCF8F4
tab.hoverForeground#261206
tab.inactiveBackground#F6ECE4
tab.inactiveForeground#6A4633
tab.unfocusedActiveBackground#FCF8F4
tab.unfocusedActiveForeground#261206
tab.unfocusedInactiveForeground#6A4633
terminal.ansiBlack#261206
terminal.ansiBlue#8F3500
terminal.ansiBrightBlack#6A4633
terminal.ansiBrightBlue#6E2800
terminal.ansiBrightCyan#16612E
terminal.ansiBrightGreen#16612E
terminal.ansiBrightMagenta#7A2B06
terminal.ansiBrightRed#961103
terminal.ansiBrightWhite#261206
terminal.ansiBrightYellow#733E00
terminal.ansiCyan#16612E
terminal.ansiGreen#16612E
terminal.ansiMagenta#7A2B06
terminal.ansiRed#961103
terminal.ansiWhite#F6ECE4
terminal.ansiYellow#733E00
terminal.background#FCF8F4
terminal.border#D0B296
terminal.findMatchBackground#FEF7EC
terminal.findMatchBorder#FDDDA2
terminal.findMatchHighlightBackground#FEF7ECCC
terminal.foreground#261206
terminal.hoverHighlightBackground#F6ECE4
terminal.inactiveSelectionBackground#ECC6A555
terminal.selectionBackground#ECC6A5B3
terminal.tab.activeBorder#8F3500
terminalCommandDecoration.defaultBackground#8F350080
terminalCommandDecoration.errorBackground#961103
terminalCommandDecoration.successBackground#16612E
terminalCursor.background#FCF8F4
terminalCursor.foreground#8F3500
terminalOverviewRuler.cursorForeground#8F3500
terminalOverviewRuler.findMatchForeground#733E00
titleBar.activeBackground#F3E7DC
titleBar.activeForeground#261206
titleBar.border#D0B296
titleBar.inactiveBackground#F6ECE4
titleBar.inactiveForeground#6A4633
walkThrough.embeddedEditorBackground#F6ECE4
welcomePage.background#FCF8F4
welcomePage.buttonBackground#F6ECE4
welcomePage.buttonHoverBackground#DECBB9
widget.shadow#00000018

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment, comment.line, comment.line.double-slash, comment.line.triple-slash, comment.line.number-sign, comment.line.dashes, comment.line.character, comment.line.percentage, comment.block, comment.block.documentation, punctuation.definition.comment, string.comment, string.quoted.docstring, string.quoted.docstring.multi, string.quoted.docstring.multi.python, string.quoted.docstring.single.python, string.quoted.double.block.python, string.quoted.single.block.python, source.kotlin comment, source.kotlin comment.line, source.kotlin comment.block, source.kotlin comment.block.documentation, source.swift comment, source.go comment, source.rust comment, source.dart comment, source.java comment, source.ts comment, source.tsx comment, source.js comment, source.jsx comment, source.python comment, source.sql comment, source.shell comment, source.yaml comment	#674534	italic
keyword, keyword.control, keyword.operator.new, keyword.operator.expression, keyword.operator.logical, keyword.operator.delete, storage, storage.type, storage.modifier	#913600	bold
entity.name.function, support.function, meta.function-call, variable.function	#7A2B06	—
entity.name.type, entity.name.class, entity.name.struct, entity.name.enum, entity.name.interface, support.class, support.type, entity.other.inherited-class	#16612E	bold
constant, constant.language, constant.numeric, support.constant	#853700	—
variable, variable.other, variable.other.readwrite, variable.other.property	#261206	—
keyword.operator, punctuation, punctuation.accessor, punctuation.separator	#261206	—
invalid, invalid.illegal, invalid.deprecated	#961103	bold underline
constant.other.color, constant.other.color.rgb-value, constant.other.uuid, support.constant.color, keyword.other.dotenv, source.env variable.other.key, source.dotenv variable.other.key	#961103	—
string.regexp, string.regexp constant.character.escape, constant.other.character-class.regexp	#961103	—
source.python string.quoted, source.js string.quoted, source.jsx string.quoted, source.ts string.quoted, source.tsx string.quoted, source.rust string.quoted, source.go string.quoted, source.kotlin string.quoted, source.swift string.quoted, source.dart string.quoted, source.sql string.quoted	#8F3600	—
source.js string.template, source.ts string.template, source.tsx string.template, source.python string.interpolated	#8F3600	—
source.python variable.parameter, source.js variable.parameter, source.jsx variable.parameter, source.ts variable.parameter, source.tsx variable.parameter, source.rust variable.parameter, source.go variable.parameter, source.kotlin variable.parameter, source.swift variable.parameter, source.dart variable.parameter	#733E00	—
source.ts entity.name.type, source.tsx entity.name.type, source.rust entity.name.type, source.go entity.name.type, source.kotlin entity.name.type, source.swift entity.name.type, source.dart entity.name.type, source.python entity.name.type.class	#16612E	bold
source.python entity.name.function.decorator, source.python variable.language.special.self, source.python variable.language.special.cls	#6E2800	italic
source.python support.function.magic	#7A2B06	bold
source.jsx entity.name.tag, source.tsx entity.name.tag, source.jsx support.class.component, source.tsx support.class.component	#16612E	bold
source.jsx entity.other.attribute-name, source.tsx entity.other.attribute-name	#733E00	—
source.sql keyword.other.DML, source.sql keyword.other.DDL, source.sql keyword.other.order, source.sql keyword.other.create	#913600	bold
source.sql constant.other.database-name, source.sql constant.other.table-name	#16612E	—
source.rust storage.modifier.lifetime, source.rust entity.name.function.macro	#7A2B06	bold
source.go entity.name.package, source.go keyword.channel	#913600	bold
source.kotlin storage.type.annotation, source.swift storage.type.annotation, source.swift keyword.other.declaration-specifier	#7A2B06	—
source.dart storage.type.annotation, source.dart support.class.flutter	#16612E	bold
source.json support.type.property-name	#16612E	bold
source.yaml entity.name.tag	#16612E	bold
source.toml entity.other.attribute-name.table, source.toml keyword.key	#16612E	bold
source.ini entity.name.section, source.ini keyword.other.definition	#16612E	bold
source.env variable.other.key, source.dotenv variable.other.key, source.env keyword.other	#961103	bold
text.html.markdown, text.plain, meta.paragraph.markdown	#261206	—
text.html.markdown markup.heading, text.html.markdown entity.name.section, text.html.markdown punctuation.definition.heading	#913600	bold
text.html.markdown markup.inline.raw, text.html.markdown markup.fenced_code	#16612E	—
text.html.markdown markup.underline.link, text.html.markdown string.other.link	#8F3500	underline
text.html.markdown markup.quote	#674534	italic
text.html entity.name.tag, text.xml entity.name.tag	#913600	bold
text.html entity.other.attribute-name, text.xml entity.other.attribute-name	#7A2B06	—
log.error, log.fatal, log.critical, log.exception	#961103	bold
log.warning, log.warn	#8F3600	bold
log.info, log.notice	#16612E	bold
log.debug, log.trace	#733E00	—
log.date, log.timestamp	#6A4633	—