Wheat Theme

Name: Wheat Theme
Author: mackilinen

Publisher: mackilinenThemes in package: 1

A light theme for VS Code

GitHub

VS Code preview

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

Wheat Theme — Wheat Theme

fetchUser.ts

index.ts

README.md

main*

Copilot

Ln 5, Col 12

Spaces: 2

UTF-8

TypeScript

Light+

colors

Workbench UI color keys from the theme JSON colors map.

activityBar.activeBorder#333333
activityBar.background#b7b6b5
activityBar.border#b7b6b5
activityBar.dropBackground#d5d3d2
activityBar.foreground#333333
activityBar.inactiveForeground#33333366
activityBarBadge.background#a300a0
activityBarBadge.foreground#f3f1f0
badge.background#a300a0
badge.foreground#f3f1f0
breadcrumb.activeSelectionForeground#292929
breadcrumb.background#f3f1f0
breadcrumb.focusForeground#292929
breadcrumb.foreground#333333cc
breadcrumbPicker.background#d5d3d2
button.background#0866a3
button.foreground#f3f1f0
button.hoverBackground#a36610
checkbox.background#d5d3d2
checkbox.border#d5d3d2
checkbox.foreground#4b4b4b
debugExceptionWidget.background#d5d3d2
debugExceptionWidget.border#d5d3d2
debugIcon.breakpointCurrentStackframeForeground#ffcc00
debugIcon.breakpointDisabledForeground#848484
debugIcon.breakpointForeground#e51400
debugIcon.breakpointStackframeForeground#89d185
debugIcon.breakpointUnverifiedForeground#848484
debugIcon.continueForeground#007acc
debugIcon.disconnectForeground#a1260d
debugIcon.pauseForeground#007acc
debugIcon.restartForeground#388a34
debugIcon.startForeground#388a34
debugIcon.stepBackForeground#007acc
debugIcon.stepIntoForeground#007acc
debugIcon.stepOutForeground#007acc
debugIcon.stepOverForeground#007acc
debugIcon.stopForeground#a1260d
debugToolBar.background#d5d3d2
descriptionForeground#717171
diffEditor.border#ff0000
diffEditor.insertedTextBackground#10a33b20
diffEditor.removedTextBackground#a3090820
dropdown.background#d5d3d2
dropdown.border#d5d3d2
dropdown.foreground#4b4b4b
editor.background#f3f1f0
editor.findMatchBackground#5008a37f
editor.findMatchHighlightBackground#5008a33f
editor.findRangeHighlightBackground#d5d3d2
editor.focusedStackFrameHighlightBackground#cee7ce73
editor.foldBackground#0866a30f
editor.foreground#333333
editor.hoverHighlightBackground#b7b6b5
editor.inactiveSelectionBackground#0866a333
editor.lineHighlightBackground#f3f1f0
editor.lineHighlightBorder#d5d3d2
editor.rangeHighlightBackground#d5d3d2
editor.selectionBackground#0866a333
editor.selectionHighlightBackground#d5d3d2
editor.snippetFinalTabstopHighlightBorder#0a326480
editor.snippetTabstopHighlightBackground#0a326433
editor.stackFrameHighlightBackground#ffff6673
editor.symbolHighlightBackground#5008a33f
editor.wordHighlightBackground#a300a07f
editor.wordHighlightStrongBackground#10a38e7f
editorBracketMatch.background#d5d3d2
editorBracketMatch.border#d5d3d2
editorCodeLens.foreground#646464
editorCursor.foreground#a300a0
editorError.border#f3f1f000
editorError.foreground#a30908
editorGroup.border#d5d3d2
editorGroup.dropBackground#b7b6b57f
editorGroup.emptyBackground#f3f1f0
editorGroup.focusedEmptyBorder#d5d3d2
editorGroupHeader.noTabsBackground#f3f1f0
editorGroupHeader.tabsBackground#d5d3d2
editorGroupHeader.tabsBorder#f3f1f0
editorGutter.addedBackground#10a33b
editorGutter.background#f3f1f0
editorGutter.commentRangeForeground#c5c5c5
editorGutter.deletedBackground#a30908
editorGutter.modifiedBackground#5008a3
editorHint.foreground#6c6c6c
editorHoverWidget.background#d5d3d2
editorHoverWidget.border#d5d3d2
editorHoverWidget.foreground#333333
editorHoverWidget.statusBarBackground#cbc8c7
editorIndentGuide.activeBackground#b7b6b5
editorIndentGuide.background#d5d3d2
editorInfo.foreground#75beff
editorLightBulb.foreground#ddb100
editorLightBulbAutoFix.foreground#007acc
editorLineNumber.activeForeground#0b216f
editorLineNumber.foreground#b7b6b5
editorLink.activeForeground#a36610
editorMarkerNavigation.background#d5d3d2
editorMarkerNavigationError.background#a30908
editorMarkerNavigationInfo.background#75beff
editorMarkerNavigationWarning.background#a3a210
editorOverviewRuler.addedForeground#10a33b7f
editorOverviewRuler.border#d5d3d2
editorOverviewRuler.bracketMatchForeground#a0a0a0
editorOverviewRuler.commonContentForeground#a300a0
editorOverviewRuler.currentContentForeground#a36610
editorOverviewRuler.deletedForeground#a309087f
editorOverviewRuler.errorForeground#a309087f
editorOverviewRuler.findMatchForeground#5008a3bf
editorOverviewRuler.incomingContentForeground#0866a3
editorOverviewRuler.infoForeground#0866a37f
editorOverviewRuler.modifiedForeground#5008a37f
editorOverviewRuler.rangeHighlightForeground#b7b6b5bf
editorOverviewRuler.selectionHighlightForeground#d5d3d2bf
editorOverviewRuler.warningForeground#a3a2107f
editorOverviewRuler.wordHighlightForeground#b7b6b5bf
editorOverviewRuler.wordHighlightStrongForeground#9b9a99bf
editorPane.background#f3f1f0
editorRuler.foreground#d5d3d2
editorSuggestWidget.background#d5d3d2
editorSuggestWidget.border#d5d3d2
editorSuggestWidget.foreground#4b4b4b
editorSuggestWidget.highlightForeground#10a38e
editorSuggestWidget.selectedBackground#b7b6b5
editorUnnecessaryCode.opacity#00000077
editorWarning.border#f3f1f000
editorWarning.foreground#a3a210
editorWhitespace.foreground#d5d3d2
editorWidget.background#d5d3d2
editorWidget.border#d5d3d2
editorWidget.foreground#333333
errorForeground#a30908
extensionBadge.remoteBackground#a300a0
extensionBadge.remoteForeground#f3f1f0
extensionButton.prominentBackground#0866a3
extensionButton.prominentForeground#f3f1f0
extensionButton.prominentHoverBackground#a36610
focusBorder#a300a0
foreground#333333
gitDecoration.addedResourceForeground#587c0c
gitDecoration.conflictingResourceForeground#a36610
gitDecoration.deletedResourceForeground#a30908
gitDecoration.ignoredResourceForeground#9b9a99
gitDecoration.modifiedResourceForeground#5008a3
gitDecoration.submoduleResourceForeground#1258a7
gitDecoration.untrackedResourceForeground#a300a0
gitlens.gutterBackgroundColor#0000000c
gitlens.gutterForegroundColor#747474
gitlens.gutterUncommittedForegroundColor#00bcf299
gitlens.lineHighlightBackgroundColor#00bcf233
gitlens.lineHighlightOverviewRulerColor#00bcf299
gitlens.trailingLineBackgroundColor#00000000
gitlens.trailingLineForegroundColor#99999959
icon.foreground#424242
imagePreview.border#80808059
input.background#f3f1f0
input.border#d5d3d2
input.foreground#4b4b4b
input.placeholderForeground#b7b6b5
inputOption.activeBackground#a300a04d
inputOption.activeBorder#a36610
inputValidation.errorBackground#d5d3d2
inputValidation.errorBorder#a30908
inputValidation.infoBackground#d5d3d2
inputValidation.infoBorder#0866a3
inputValidation.warningBackground#d5d3d2
inputValidation.warningBorder#a3a210
list.activeSelectionBackground#a309087f
list.activeSelectionForeground#f3f1f0
list.deemphasizedForeground#8e8e90
list.dropBackground#9b9a99
list.errorForeground#a30908
list.filterMatchBackground#5008a33f
list.focusBackground#9b9a99
list.focusForeground#f3f1f0
list.highlightForeground#5008a3
list.hoverBackground#b7b6b5
list.hoverForeground#4b4b4b
list.inactiveSelectionBackground#a309081f
list.inactiveSelectionForeground#333333
list.invalidItemForeground#10a33b
list.warningForeground#5008a3
listFilterWidget.background#d5d3d2
listFilterWidget.noMatchesOutline#10a33b
listFilterWidget.outline#0866a3
menu.background#d5d3d2
menu.foreground#333333
menu.selectionBackground#a309087f
menu.selectionForeground#f3f1f0
menu.separatorBackground#888888
menubar.selectionBackground#0000001a
menubar.selectionForeground#333333
merge.border#7f7e7e
merge.commonContentBackground#a300a04c
merge.commonHeaderBackground#a300a04c
merge.currentContentBackground#a366104c
merge.currentHeaderBackground#a366104c
merge.incomingContentBackground#0866a34c
merge.incomingHeaderBackground#0866a34c
minimap.errorHighlight#ff1212b3
minimap.findMatchHighlight#d18616
minimap.selectionHighlight#add6ff
minimap.warningHighlight#a3a210
minimapGutter.addedBackground#81b88b
minimapGutter.deletedBackground#ca4b51
minimapGutter.modifiedBackground#66afe0
minimapSlider.activeBackground#6464643f
minimapSlider.background#9b9a993f
minimapSlider.hoverBackground#7f7e7e3f
notebook.cellToolbarSeperator#80808059
notebook.focusedCellIndicator#66afe0
notebook.outputContainerBackgroundColor#e4e6f1
notificationCenterHeader.background#cbc8c7
notificationLink.foreground#006ab1
notifications.background#d5d3d2
notifications.border#cbc8c7
notifications.foreground#333333
notificationsErrorIcon.foreground#a30908
notificationsInfoIcon.foreground#75beff
notificationsWarningIcon.foreground#a3a210
panel.background#f3f1f0
panel.border#d5d3d2
panel.dropBackground#2677cb2e
panelInput.border#dddddd
panelTitle.activeBorder#9b9a99
panelTitle.activeForeground#4b4b4b
panelTitle.inactiveForeground#7f7e7e
peekView.border#5008a3
peekViewEditor.background#f3f1f0
peekViewEditor.matchHighlightBackground#5008a37f
peekViewEditorGutter.background#f3f1f0
peekViewResult.background#d5d3d2
peekViewResult.fileForeground#4b4b4b
peekViewResult.lineForeground#333333
peekViewResult.matchHighlightBackground#5008a37f
peekViewResult.selectionBackground#b7b6b5
peekViewResult.selectionForeground#333333
peekViewTitle.background#b7b6b5
peekViewTitleDescription.foreground#4b4b4b
peekViewTitleLabel.foreground#333333
pickerGroup.border#646464
pickerGroup.foreground#333333
problemsErrorIcon.foreground#a30908
problemsInfoIcon.foreground#75beff
problemsWarningIcon.foreground#a3a210
progressBar.background#a30908
quickInput.background#d5d3d2
quickInput.foreground#333333
quickInputTitle.background#0000000f
scrollbar.shadow#33333366
scrollbarSlider.activeBackground#6464647f
scrollbarSlider.background#9b9a997f
scrollbarSlider.hoverBackground#7f7e7e7f
searchEditor.findMatchBackground#5008a32a
searchEditor.textInputBorder#d5d3d2
selection.background#b7b6b5
settings.checkboxBackground#d5d3d2
settings.checkboxBorder#d5d3d2
settings.checkboxForeground#4b4b4b
settings.dropdownBackground#d5d3d2
settings.dropdownBorder#d5d3d2
settings.dropdownForeground#4b4b4b
settings.dropdownListBorder#d5d3d2
settings.headerForeground#444444
settings.modifiedItemIndicator#66afe0
settings.numberInputBackground#f3f1f0
settings.numberInputBorder#d5d3d2
settings.numberInputForeground#4b4b4b
settings.textInputBackground#f3f1f0
settings.textInputBorder#d5d3d2
settings.textInputForeground#4b4b4b
sideBar.background#d5d3d2
sideBar.border#b7b6b5
sideBar.dropBackground#0000001a
sideBar.foreground#4b4b4b
sideBarSectionHeader.background#b7b6b5
sideBarSectionHeader.foreground#4b4b4b
sideBarTitle.foreground#646464
statusBar.background#4b4b4b
statusBar.border#0866a37f
statusBar.debuggingBackground#10a33b
statusBar.debuggingBorder#10a33b7f
statusBar.debuggingForeground#f3f1f0
statusBar.foreground#f3f1f0
statusBar.noFolderBackground#a3a210
statusBar.noFolderBorder#a3a2107f
statusBar.noFolderForeground#f3f1f0
statusBarItem.activeBackground#a36610
statusBarItem.hoverBackground#a30908
statusBarItem.prominentBackground#a36610
statusBarItem.prominentForeground#f3f1f0
statusBarItem.prominentHoverBackground#a30908
statusBarItem.remoteBackground#a300a0
statusBarItem.remoteForeground#f3f1f0
symbolIcon.arrayForeground#333333
symbolIcon.booleanForeground#333333
symbolIcon.classForeground#d67e00
symbolIcon.colorForeground#333333
symbolIcon.constantForeground#333333
symbolIcon.constructorForeground#652d90
symbolIcon.enumeratorForeground#d67e00
symbolIcon.enumeratorMemberForeground#007acc
symbolIcon.eventForeground#d67e00
symbolIcon.fieldForeground#007acc
symbolIcon.fileForeground#333333
symbolIcon.folderForeground#333333
symbolIcon.functionForeground#652d90
symbolIcon.interfaceForeground#007acc
symbolIcon.keyForeground#333333
symbolIcon.keywordForeground#333333
symbolIcon.methodForeground#652d90
symbolIcon.moduleForeground#333333
symbolIcon.namespaceForeground#333333
symbolIcon.nullForeground#333333
symbolIcon.numberForeground#333333
symbolIcon.objectForeground#333333
symbolIcon.operatorForeground#333333
symbolIcon.packageForeground#333333
symbolIcon.propertyForeground#333333
symbolIcon.referenceForeground#333333
symbolIcon.snippetForeground#333333
symbolIcon.stringForeground#333333
symbolIcon.structForeground#333333
symbolIcon.textForeground#333333
symbolIcon.typeParameterForeground#333333
symbolIcon.unitForeground#333333
symbolIcon.variableForeground#007acc
tab.activeBackground#f3f1f0
tab.activeForeground#4b4b4b
tab.activeModifiedBorder#33aaee
tab.border#f3f1f0
tab.inactiveBackground#d5d3d2
tab.inactiveForeground#9b9a99
tab.inactiveModifiedBorder#33aaee80
tab.unfocusedActiveBackground#f3f1f0
tab.unfocusedActiveForeground#9b9a99
tab.unfocusedActiveModifiedBorder#33aaeeb3
tab.unfocusedInactiveForeground#b7b6b5
tab.unfocusedInactiveModifiedBorder#33aaee40
terminal.ansiBlack#333333
terminal.ansiBlue#0866a3
terminal.ansiBrightBlack#000000
terminal.ansiBrightBlue#064874
terminal.ansiBrightCyan#0b7263
terminal.ansiBrightGreen#0b6e28
terminal.ansiBrightMagenta#6f006d
terminal.ansiBrightRed#740606
terminal.ansiBrightWhite#b7b6b5
terminal.ansiBrightYellow#6e6e0b
terminal.ansiCyan#10a38e
terminal.ansiGreen#10a33b
terminal.ansiMagenta#a300a0
terminal.ansiRed#a30908
terminal.ansiWhite#d5d3d2
terminal.ansiYellow#a3a210
terminal.background#f3f1f0
terminal.border#d5d3d2
terminal.foreground#333333
terminal.selectionBackground#0866a37f
terminalCursor.background#d5d3d2
terminalCursor.foreground#646464
textBlockQuote.background#7f7f7f1a
textBlockQuote.border#007acc80
textCodeBlock.background#dcdcdc66
textLink.activeForeground#006ab1
textLink.foreground#006ab1
textPreformat.foreground#a31515
textSeparator.foreground#0000002e
titleBar.activeBackground#b7b6b5
titleBar.activeForeground#333333
titleBar.border#9b9a99
titleBar.inactiveBackground#b7b6b5
titleBar.inactiveForeground#646464
tree.indentGuidesStroke#d5d3d2
walkThrough.embeddedEditorBackground#f3f1f0
welcomePage.buttonBackground#d5d3d2
welcomePage.buttonHoverBackground#b7b6b5
widget.shadow#33333366

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment	#9B9A99	—
string.quoted.double.html	#0866a3	—
string.quoted.single.html	#0866a3	—
constant	#10A38E	—
entity	#A36610	—
entity.name.tag	#A300A0	—
entity.other.attribute-name.class	#A300A0	—
entity.other.attribute-name.id	#A300A0	—
keyword	#A300A0	—
storage	#10A38E	—
storage.modifier	#0866a3	—
string	#A30908	—
support	#A36610	—
support.constant	#10A38E	—
support.type.primitive	#A300A0	—
variable	#333333	—
variable.language	#A300A0	—
markup.heading	#A36610	—
markup.changed	#5008A3	—
markup.underline	—	underline
markup.underline.link	#0866A3	—
markup.list	#333333	—
markup.raw	#10A38E	—
invalid	#A30908	—
markup.deleted	#A30908	—
markup.inserted	#10A33B	—
token.info-token	#316BCD	—
token.warn-token	#CD9731	—
token.error-token	#CD3131	—
token.debug-token	#800080	—

Shiki preview

TypeScript sample highlighted with this variant's colors and tokenColors.

export interface User {
  id: string;
  name: string;
  role: "admin" | "member";
  tags: string[];
}

/**
 * Fetch user data by ID
 * @param id  
 * @returns User object or null if ID is invalid
 */
export async function fetchUser(id: string): Promise<User | null> {
  if (!id) {
    return null;
  }

  const response = await fetch(`/api/users/${id}`, {
    method: "GET",
    headers: { Accept: "application/json" },
  });

  if (!response.ok) {
    throw new Error(`HTTP ${response.status}`);
  }

  return (await response.json()) as User;
}

function greet(user: User): string {
  // Simple greeting function that uses the user's name
  return `Hello, ${user.name}!`;
}