E-Ink

Name: E-Ink
Author: mufanza

Publisher: mufanzaThemes in package: 1

A Light color theme optimized for usage with black-and-white E-Ink monitors (Dasung)

Open in VS Code GitHub

VS Code preview

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

E-Ink — E-Ink

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.activeBackground#000000
activityBar.activeBorder#000000
activityBar.activeFocusBorder#000000
activityBar.background#ffffff
activityBar.border#000000
activityBar.dropBorder#000000
activityBar.foreground#999999
activityBar.inactiveForeground#000000
activityBarBadge.background#000000
activityBarBadge.foreground#ffffff
badge.background#000000
badge.foreground#ffffff
breadcrumb.activeSelectionForeground#000000
breadcrumb.background#ffffff
breadcrumb.focusForeground#999999
breadcrumb.foreground#000000
breadcrumbPicker.background#ffffff
button.background#000000
button.foreground#ffffff
button.hoverBackground#999999
button.secondaryBackground#999999
button.secondaryForeground#ffffff
button.secondaryHoverBackground#cccccc
checkbox.background#000000
checkbox.border#000000
checkbox.foreground#ffffff
contrastActiveBorder#000000
contrastBorder#000000
debugConsole.errorForeground#000000
debugConsole.infoForeground#cdcdcd
debugConsole.sourceForeground#000000
debugConsole.warningForeground#cccccc
debugConsoleInputIcon.foreground#000000
debugExceptionWidget.background#cccccc
debugExceptionWidget.border#000000
debugIcon.breakpointCurrentStackframeForeground#999999
debugIcon.breakpointDisabledForeground#cdcdcd
debugIcon.breakpointForeground#000000
debugIcon.breakpointStackframeForeground#000000
debugIcon.breakpointUnverifiedForeground#cccccc
debugIcon.continueForeground#000000
debugIcon.disconnectForeground#cdcdcd
debugIcon.pauseForeground#999999
debugIcon.restartForeground#000000
debugIcon.startForeground#000000
debugIcon.stepBackForeground#000000
debugIcon.stepIntoForeground#000000
debugIcon.stepOutForeground#000000
debugIcon.stepOverForeground#000000
debugIcon.stopForeground#999999
debugTokenExpression.boolean#cdcdcd
debugTokenExpression.error#000000
debugTokenExpression.name#cdcdcd
debugTokenExpression.number#cdcdcd
debugTokenExpression.string#cdcdcd
debugTokenExpression.value#cdcdcd
debugToolBar.background#ffffff
debugToolBar.border#000000
debugView.exceptionLabelBackground#cccccc
debugView.exceptionLabelForeground#000000
debugView.stateLabelBackground#ffffff
debugView.stateLabelForeground#000000
debugView.valueChangedHighlight#cdcdcd
descriptionForeground#000000
diffEditor.border#000000
diffEditor.diagonalFill#cdcdcd
diffEditor.insertedTextBackground#cdcdcd
diffEditor.insertedTextBorder#000000
diffEditor.removedTextBackground#cccccc
diffEditor.removedTextBorder#000000
dropdown.background#ffffff
dropdown.border#000000
dropdown.foreground#000000
dropdown.listBackground#cccccc
editor.background#ffffff
editor.findMatchBackground#ffffff
editor.findMatchBorder#00000070
editor.findMatchHighlightBackground#cdcdcd
editor.findMatchHighlightBorder#ffffff
editor.findRangeHighlightBackground#cdcdcd
editor.foldBackground#999999
editor.foreground#000000
editor.inactiveSelectionBackground#cdcdcd
editor.lineHighlightBorder#00000000
editor.rangeHighlightBackground#cdcdcd
editor.rangeHighlightBorder#cccccc
editor.selectionBackground#cccccc
editor.selectionForeground#000000
editor.selectionHighlightBackground#aaaaaa
editor.selectionHighlightBorder#ffffff00
editor.snippetFinalTabstopHighlightBackground#ffffff
editor.snippetFinalTabstopHighlightBorder#000000
editor.snippetTabstopHighlightBackground#cdcdcd
editor.snippetTabstopHighlightBorder#cdcdcd
editor.stackFrameHighlightBackground#ffffff
editor.symbolHighlightBackground#ffffff
editor.symbolHighlightBorder#ffffff
editor.wordHighlightBackground#cdcdcd50
editor.wordHighlightBorder#00000000
editor.wordHighlightStrongBackground#bbbbbb
editor.wordHighlightStrongBorder#00000000
editorBracketMatch.background#cccccc
editorBracketMatch.border#888888
editorCodeLens.foreground#000000
editorCursor.background#ffffff
editorCursor.foreground#000000
editorGutter.addedBackground#ffffff
editorGutter.background#ffffff
editorGutter.commentRangeForeground#ffffff
editorGutter.deletedBackground#ffffff
editorGutter.foldingControlForeground#ffffff
editorGutter.modifiedBackground#ffffff
editorHint.border#000000
editorHint.foreground#000000
editorHoverWidget.background#cdcdcd
editorHoverWidget.border#cdcdcd
editorHoverWidget.foreground#000000
editorHoverWidget.statusBarBackground#cccccc
editorIndentGuide.activeBackground#cccccc
editorIndentGuide.background#dddddd
editorInfo.border#cccccc
editorInfo.foreground#000000
editorLightBulb.foreground#000000
editorLightBulbAutoFix.foreground#000000
editorLineNumber.activeForeground#000000
editorLineNumber.foreground#9f9f9f
editorMarkerNavigation.background#ffffff
editorMarkerNavigationError.background#999999
editorMarkerNavigationInfo.background#cdcdcd
editorMarkerNavigationWarning.background#cccccc
editorOverviewRuler.addedForeground#000000
editorOverviewRuler.background#ffffff
editorOverviewRuler.border#000000
editorOverviewRuler.bracketMatchForeground#000000
editorOverviewRuler.commonContentForeground#000000
editorOverviewRuler.currentContentForeground#000000
editorOverviewRuler.deletedForeground#cccccc
editorOverviewRuler.errorForeground#999999
editorOverviewRuler.findMatchForeground#000000
editorOverviewRuler.incomingContentForeground#000000
editorOverviewRuler.infoForeground#cdcdcd
editorOverviewRuler.modifiedForeground#000000
editorOverviewRuler.rangeHighlightForeground#000000
editorOverviewRuler.selectionHighlightForeground#000000
editorOverviewRuler.warningForeground#cccccc
editorOverviewRuler.wordHighlightForeground#00000050
editorOverviewRuler.wordHighlightStrongForeground#00000050
editorPane.background#ffffff
editorRuler.foreground#000000
editorSuggestWidget.background#ffffff
editorSuggestWidget.border#000000
editorSuggestWidget.foreground#000000
editorSuggestWidget.highlightForeground#000000
editorSuggestWidget.selectedBackground#cccccc
editorWarning.foreground#888888
editorWhitespace.foreground#ffffff00
editorWidget.background#ffffff
editorWidget.border#000000
editorWidget.foreground#000000
editorWidget.resizeBorder#000000
extensionBadge.remoteBackground#000000
extensionBadge.remoteForeground#ffffff
extensionButton.prominentBackground#ffffff
extensionButton.prominentForeground#000000
extensionButton.prominentHoverBackground#999999
focusBorder#000000
foreground#000000
icon.foreground#000000
input.background#ffffff
input.border#000000
input.foreground#000000
input.placeholderForeground#999999
inputOption.activeBackground#cccccc
inputOption.activeBorder#999999
menu.background#ffffff
menu.border#000000
menu.foreground#000000
menu.selectionBackground#999999
menu.selectionBorder#cccccc
menu.selectionForeground#000000
menu.separatorBackground#000000
menubar.selectionBackground#cccccc
menubar.selectionBorder#cccccc
menubar.selectionForeground#000000
merge.border#000000
merge.commonContentBackground#cccccc
merge.commonHeaderBackground#cccccc
merge.currentContentBackground#cdcdcd
merge.currentHeaderBackground#cdcdcd
merge.incomingContentBackground#ffffff
merge.incomingHeaderBackground#ffffff
minimap.background#ffffff
minimap.errorHighlight#cccccc
minimap.findMatchHighlight#cdcdcd
minimap.selectionHighlight#000000
minimap.warningHighlight#999999
minimapGutter.addedBackground#cccccc
minimapGutter.deletedBackground#000000
minimapGutter.modifiedBackground#999999
minimapSlider.activeBackground#00000050
minimapSlider.background#cccccc
minimapSlider.hoverBackground#cdcdcd
notebook.cellBorderColor#000000
notebook.cellHoverBackground#cdcdcd
notebook.cellInsertionIndicator#000000
notebook.cellStatusBarItemHoverBackground#ffffff
notebook.cellToolbarSeparator#000000
notebook.focusedCellBackground#cccccc
notebook.focusedCellBorder#000000
notebook.focusedEditorBorder#000000
notebook.outputContainerBackgroundColor#ffffff
notebook.symbolHighlightBackground#cdcdcd
notebookScrollbarSlider.activeBackground#cccccc
notebookScrollbarSlider.background#000000
notebookScrollbarSlider.hoverBackground#cccccc
notebookStatusErrorIcon.foreground#000000
notebookStatusRunningIcon.foreground#cccccc
notebookStatusSuccessIcon.foreground#cdcdcd
notificationCenter.border#000000
notificationCenterHeader.background#ffffff
notificationCenterHeader.foreground#999999
notificationLink.foreground#999999
notifications.background#ffffff
notifications.border#000000
notifications.foreground#000000
notificationsErrorIcon.foreground#999999
notificationsInfoIcon.foreground#cdcdcd
notificationsWarningIcon.foreground#cccccc
notificationToast.border#000000
panel.background#ffffff
panel.border#000000
panel.dropBorder#d3d3d3
panelInput.border#000000
panelSection.border#000000
panelSection.dropBackground#cdcdcd
panelSectionHeader.background#ffffff
panelSectionHeader.border#000000
panelSectionHeader.foreground#000000
panelTitle.activeBorder#000000
panelTitle.activeForeground#000000
panelTitle.inactiveForeground#000000
peekView.border#000000
peekViewEditor.background#ffffff
peekViewEditor.matchHighlightBackground#cdcdcd
peekViewEditor.matchHighlightBorder#000000
peekViewEditorGutter.background#ffffff
peekViewResult.background#ffffff
peekViewResult.fileForeground#000000
peekViewResult.lineForeground#000000
peekViewResult.matchHighlightBackground#cdcdcd
peekViewResult.selectionBackground#cccccc
peekViewResult.selectionForeground#000000
peekViewTitle.background#ffffff
peekViewTitleDescription.foreground#000000
peekViewTitleLabel.foreground#000000
pickerGroup.border#000000
pickerGroup.foreground#000000
problemsErrorIcon.foreground#cccccc
problemsInfoIcon.foreground#cdcdcd
problemsWarningIcon.foreground#999999
progressBar.background#000000
quickInput.background#ffffff
quickInput.foreground#000000
quickInputTitle.background#000000
scm.providerBorder#000000
scrollbarSlider.activeBackground#000000
scrollbarSlider.background#000000
scrollbarSlider.hoverBackground#cccccc
searchEditor.findMatchBackground#ffffff
searchEditor.findMatchBorder#000000
searchEditor.textInputBorder#000000
selection.background#999999
settings.checkboxBackground#000000
settings.checkboxBorder#000000
settings.checkboxForeground#ffffff
settings.dropdownBackground#ffffff
settings.dropdownBorder#000000
settings.dropdownForeground#000000
settings.dropdownListBorder#000000
settings.headerForeground#000000
settings.modifiedItemIndicator#000000
settings.numberInputBackground#ffffff
settings.numberInputBorder#000000
settings.numberInputForeground#000000
settings.textInputBackground#ffffff
settings.textInputBorder#000000
settings.textInputForeground#000000
sideBar.background#ffffff
sideBar.border#000000
sideBar.dropBackground#cdcdcd
sideBar.foreground#000000
sideBarSectionHeader.background#ffffff
sideBarSectionHeader.border#000000
sideBarSectionHeader.foreground#000000
sideBarTitle.foreground#000000
statusBar.background#ffffff
statusBar.border#000000
statusBar.debuggingBackground#cccccc
statusBar.debuggingBorder#000000
statusBar.debuggingForeground#000000
statusBar.foreground#000000
statusBar.noFolderBackground#999999
statusBar.noFolderBorder#000000
statusBar.noFolderForeground#000000
statusBarItem.activeBackground#cccccc
statusBarItem.hoverBackground#cdcdcd
statusBarItem.prominentBackground#999999
statusBarItem.prominentForeground#000000
statusBarItem.prominentHoverBackground#cccccc
statusBarItem.remoteBackground#000000
statusBarItem.remoteForeground#ffffff
symbolIcon.arrayForeground#000000
symbolIcon.booleanForeground#000000
symbolIcon.classForeground#000000
symbolIcon.colorForeground#000000
symbolIcon.constantForeground#000000
symbolIcon.constructorForeground#000000
symbolIcon.enumeratorForeground#000000
symbolIcon.enumeratorMemberForeground#000000
symbolIcon.eventForeground#000000
symbolIcon.fieldForeground#000000
symbolIcon.fileForeground#000000
symbolIcon.folderForeground#000000
symbolIcon.functionForeground#000000
symbolIcon.interfaceForeground#000000
symbolIcon.keyForeground#000000
symbolIcon.keywordForeground#000000
symbolIcon.methodForeground#000000
symbolIcon.moduleForeground#000000
symbolIcon.namespaceForeground#000000
symbolIcon.nullForeground#000000
symbolIcon.numberForeground#000000
symbolIcon.objectForeground#000000
symbolIcon.operatorForeground#000000
symbolIcon.packageForeground#000000
symbolIcon.propertyForeground#000000
symbolIcon.referenceForeground#000000
symbolIcon.snippetForeground#000000
symbolIcon.stringForeground#000000
symbolIcon.structForeground#000000
symbolIcon.textForeground#000000
symbolIcon.typeParameterForeground#000000
symbolIcon.unitForeground#000000
symbolIcon.variableForeground#000000
tab.activeBackground#ffffff
tab.activeBorder#ffffff
tab.activeBorderTop#000000
tab.activeForeground#000000
tab.activeModifiedBorder#ffffff
tab.border#000000
tab.hoverBackground#dddddd
tab.hoverBorder#dddddd
tab.hoverForeground#000000
tab.inactiveBackground#cccccc
tab.inactiveForeground#000000
tab.inactiveModifiedBorder#000000
tab.unfocusedActiveBackground#cdcdcd
tab.unfocusedActiveBorder#000000
tab.unfocusedActiveBorderTop#000000
tab.unfocusedActiveForeground#000000
tab.unfocusedActiveModifiedBorder#000000
tab.unfocusedHoverBackground#cdcdcd
tab.unfocusedHoverBorder#000000
tab.unfocusedHoverForeground#000000
tab.unfocusedInactiveBackground#999999
tab.unfocusedInactiveForeground#000000
tab.unfocusedInactiveModifiedBorder#999999
terminal.background#ffffff
terminal.border#000000
terminal.foreground#000000
terminal.selectionBackground#cdcdcd
terminalCursor.background#ffffff
terminalCursor.foreground#000000
textBlockQuote.background#ffffff
textBlockQuote.border#000000
textCodeBlock.background#ffffff
textLink.activeForeground#cccccc
textLink.foreground#000000
textPreformat.foreground#000000
textSeparator.foreground#000000
titleBar.activeBackground#ffffff
titleBar.activeForeground#000000
titleBar.border#000000
titleBar.inactiveBackground#cccccc
titleBar.inactiveForeground#000000
tree.indentGuidesStroke#000000
walkThrough.embeddedEditorBackground#ffffff
welcomePage.background#ffffff
window.activeBorder#000000
window.inactiveBorder#cdcdcd

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
support.function, variable.function	—	bold
entity.name.function, storage.type	—	bold
meta.function-call entity.name.function	—	bold
keyword.control.conditional	—	bold
variable.interpolation	—	bold
variable.parameter	—	bold
storage	—	bold
constant.other.object.key string.unquoted	—	bold
string.quoted, string, punctuation.tag.definition.string, tag.string	#777777	—
variable.language.this	—	bold
constant.other.object.key string.unquoted	—	bold
comment	#888888	italic
entity.name.type	—	bold
entity.other.inherited-class	—	bold
keyword, keyword.operator.new, keyword.other, keyword.control	—	bold
keyword.operator	—	bold
keyword.control.conditional, source.php keyword.control	—	bold
keyword.control.trycatch	—	bold
keyword.control	—	bold
keyword.control.flow	—	bold
meta.brace, punctuation.definition.parameters.begin, punctuation.definition.parameters.end, punctuation.definition.block, punctuation.definition.template-expression.begin, punctuation.definition.template-expression.end, punctuation.section.embedded.begin, punctuation.section.embedded.end	—	bold
meta.brace.square	#000000	bold
support.type.property-name.json	#000000	bold
markup.bold.markdown	#000000	bold
variable.scss, variable.sass, variable.parameter.url.scss, variable.parameter.url.sass	#000000	bold
source.css.scss meta.at-rule variable, source.css.sass meta.at-rule variable	#000000	bold
source.css.scss meta.at-rule variable, source.css.sass meta.at-rule variable	#000000	bold
meta.attribute-selector.scss entity.other.attribute-name.attribute, meta.attribute-selector.sass entity.other.attribute-name.attribute	#000000	bold
entity.name.tag.scss, entity.name.tag.sass	#000000	bold
keyword.other.unit.scss, keyword.other.unit.sass	#000000	bold
entity.other.attribute-name	#000000	bold
markup.inserted, punctuation.definition.inserted.diff, punctuation.definition.to-file.diff, meta.diff.header.to-file	#888888	bold
markup.deleted, punctuation.definition.deleted.diff, punctuation.definition.from-file.diff, meta.diff.header.from-file	#bbbbbb	strikethrough

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