OhLED Themes (142-in-1)

Name: OhLED Themes (142-in-1)
Author: Ophuscado

Publisher: OphuscadoThemes in package: 142

The OhLED Themes (142-in-1) for VSCode are inspired by the classic CRT monitors of yesteryear, specially crafted for the modern OLED displays of today.

Open in VS Code GitHub

Color themes

VS Code preview

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

OhLED Themes (142-in-1) — OhLED_OldLace

fetchUser.ts

index.ts

README.md

srccomponentsfetchUser.tsfetchUser

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...

main*

Copilot

Ln 5, Col 12

Spaces: 2

UTF-8

TypeScript

Dark+

colors

Workbench UI color keys from the theme JSON colors map.

activityBar.activeBackground#FDF5E688
activityBar.activeBorder#FDF5E688
activityBar.activeFocusBorder#FDF5E688
activityBar.background#000000
activityBar.border#FDF5E688
activityBar.dropBorder#FDF5E688
activityBar.foreground#FDF5E6
activityBar.inactiveForeground#FDF5E688
activityBarBadge.background#FDF5E6
activityBarBadge.foreground#000000
badge.background#000000
badge.foreground#FDF5E6
breadcrumb.activeSelectionForeground#FDF5E6
breadcrumb.background#000000
breadcrumb.focusForeground#FDF5E6
breadcrumb.foreground#FDF5E688
breadcrumbPicker.background#000000
button.background#000000
button.foreground#FDF5E6
button.hoverBackground#FDF5E688
checkbox.background#000000
checkbox.border#FDF5E688
checkbox.foreground#FDF5E6
debugConsole.errorForeground#FDF5E6
debugConsole.infoForeground#FDF5E6
debugConsole.sourceForeground#FDF5E6
debugConsole.warningForeground#FDF5E6
debugConsoleInputIcon.foreground#FDF5E6
debugExceptionWidget.background#000000
debugExceptionWidget.border#FDF5E688
debugIcon.breakpointCurrentStackframeForeground#FDF5E6
debugIcon.breakpointDisabledForeground#FDF5E633
debugIcon.breakpointForeground#FDF5E6
debugIcon.breakpointStackframeForeground#FDF5E6
debugIcon.breakpointUnverifiedForeground#FDF5E6
debugIcon.continueForeground#FDF5E6
debugIcon.disconnectForeground#FDF5E6
debugIcon.pauseForeground#FDF5E6
debugIcon.restartForeground#FDF5E6
debugIcon.startForeground#FDF5E6
debugIcon.stepBackForeground#FDF5E6
debugIcon.stepIntoForeground#FDF5E6
debugIcon.stepOutForeground#FDF5E6
debugIcon.stepOverForeground#FDF5E6
debugIcon.stopForeground#FDF5E6
debugTokenExpression.boolean#FDF5E6
debugTokenExpression.error#FDF5E6
debugTokenExpression.name#FDF5E6
debugTokenExpression.number#FDF5E6
debugTokenExpression.string#FDF5E6
debugTokenExpression.value#FDF5E6
debugToolBar.background#000000
debugToolBar.border#FDF5E688
debugView.exceptionLabelBackground#000000
debugView.exceptionLabelForeground#FDF5E6
debugView.stateLabelBackground#000000
debugView.stateLabelForeground#FDF5E6
debugView.valueChangedHighlight#FDF5E688
descriptionForeground#FDF5E6
diffEditor.border#FDF5E688
diffEditor.diagonalFill#FDF5E611
diffEditor.insertedTextBackground#FDF5E633
diffEditor.removedTextBackground#FDF5E633
dropdown.background#000000
dropdown.border#FDF5E688
dropdown.foreground#FDF5E6
dropdown.listBackground#000000
editor.background#000000
editor.findMatchBackground#FDF5E688
editor.findMatchBorder#FDF5E688
editor.findMatchHighlightBackground#000000
editor.findMatchHighlightBorder#FDF5E688
editor.findRangeHighlightBackground#000000
editor.findRangeHighlightBorder#FDF5E688
editor.focusedStackFrameHighlightBackground#000000
editor.foldBackground#000000
editor.foreground#FDF5E6
editor.hoverHighlightBackground#33312eff
editor.inactiveSelectionBackground#000000
editor.lineHighlightBackground#FDF5E611
editor.rangeHighlightBackground#000000
editor.rangeHighlightBorder#FDF5E688
editor.selectionBackground#FDF5E633
editor.selectionForeground#FDF5E6
editor.selectionHighlightBackground#000000
editor.selectionHighlightBorder#FDF5E688
editor.snippetFinalTabstopHighlightBackground#000000
editor.snippetFinalTabstopHighlightBorder#FDF5E688
editor.snippetTabstopHighlightBackground#000000
editor.snippetTabstopHighlightBorder#FDF5E688
editor.stackFrameHighlightBackground#000000
editor.symbolHighlightBackground#FDF5E633
editor.symbolHighlightBorder#FDF5E688
editor.wordHighlightBackground#FDF5E633
editor.wordHighlightBorder#FDF5E688
editor.wordHighlightStrongBackground#FDF5E688
editor.wordHighlightStrongBorder#FDF5E688
editorBracketMatch.background#000000
editorBracketMatch.border#FDF5E688
editorCodeLens.foreground#FDF5E6
editorCursor.background#000000
editorCursor.foreground#FDF5E6
editorError.border#FDF5E688
editorError.foreground#FDF5E6
editorGroup.border#FDF5E688
editorGroup.dropBackground#FDF5E633
editorGroup.emptyBackground#000000
editorGroup.focusedEmptyBorder#FDF5E688
editorGroupHeader.border#FDF5E688
editorGroupHeader.noTabsBackground#000000
editorGroupHeader.tabsBackground#000000
editorGroupHeader.tabsBorder#FDF5E688
editorGutter.addedBackground#FDF5E633
editorGutter.background#000000
editorGutter.commentRangeForeground#FDF5E633
editorGutter.deletedBackground#FDF5E633
editorGutter.foldingControlForeground#FDF5E688
editorGutter.modifiedBackground#FDF5E633
editorHint.border#FDF5E688
editorHint.foreground#FDF5E6
editorHoverWidget.background#33312eff
editorHoverWidget.border#FDF5E688
editorHoverWidget.foreground#FDF5E6
editorHoverWidget.statusBarBackground#FDF5E633
editorIndentGuide.activeBackground#FDF5E633
editorIndentGuide.background#FDF5E611
editorInfo.border#FDF5E688
editorInfo.foreground#FDF5E6
editorLightBulb.foreground#FDF5E688
editorLightBulbAutoFix.foreground#FDF5E688
editorLineNumber.activeForeground#FDF5E6
editorLineNumber.foreground#FDF5E633
editorLink.activeForeground#FDF5E6
editorMarkerNavigation.background#FDF5E633
editorMarkerNavigationError.background#FDF5E633
editorMarkerNavigationInfo.background#FDF5E633
editorMarkerNavigationWarning.background#FDF5E633
editorOverviewRuler.addedForeground#FDF5E633
editorOverviewRuler.background#000000
editorOverviewRuler.border#FDF5E688
editorOverviewRuler.bracketMatchForeground#FDF5E633
editorOverviewRuler.commonContentForeground#FDF5E633
editorOverviewRuler.currentContentForeground#FDF5E633
editorOverviewRuler.deletedForeground#FDF5E633
editorOverviewRuler.errorForeground#FDF5E688
editorOverviewRuler.findMatchForeground#FDF5E633
editorOverviewRuler.incomingContentForeground#FDF5E633
editorOverviewRuler.infoForeground#FDF5E633
editorOverviewRuler.modifiedForeground#FDF5E633
editorOverviewRuler.rangeHighlightForeground#FDF5E633
editorOverviewRuler.selectionHighlightForeground#FDF5E633
editorOverviewRuler.warningForeground#FDF5E633
editorOverviewRuler.wordHighlightForeground#FDF5E633
editorOverviewRuler.wordHighlightStrongForeground#FDF5E633
editorPane.background#FDF5E633
editorRuler.foreground#FDF5E6
editorSuggestWidget.background#000000
editorSuggestWidget.border#FDF5E688
editorSuggestWidget.foreground#FDF5E6
editorSuggestWidget.highlightForeground#FDF5E6
editorSuggestWidget.selectedBackground#FDF5E688
editorUnnecessaryCode.border#FDF5E688
editorUnnecessaryCode.opacity#FDF5E633
editorWarning.border#FDF5E688
editorWarning.foreground#FDF5E6
editorWhitespace.foreground#FDF5E633
editorWidget.background#000000
editorWidget.border#FDF5E688
editorWidget.foreground#FDF5E6
editorWidget.resizeBorder#FDF5E688
errorForeground#FDF5E6
extensionBadge.remoteBackground#000000
extensionBadge.remoteForeground#FDF5E6
extensionButton.prominentBackground#000000
extensionButton.prominentForeground#FDF5E6
extensionButton.prominentHoverBackground#000000
focusBorder#FDF5E688
foreground#FDF5E6
gitDecoration.addedResourceForeground#FDF5E6
gitDecoration.conflictingResourceForeground#FDF5E6
gitDecoration.deletedResourceForeground#FDF5E6
gitDecoration.ignoredResourceForeground#FDF5E688
gitDecoration.modifiedResourceForeground#FDF5E6
gitDecoration.submoduleResourceForeground#FDF5E6
gitDecoration.untrackedResourceForeground#FDF5E6
icon.foreground#FDF5E6
imagePreview.border#FDF5E688
input.background#000000
input.border#FDF5E688
input.foreground#FDF5E6
input.placeholderForeground#FDF5E688
inputOption.activeBackground#FDF5E633
inputOption.activeBorder#FDF5E688
inputOption.activeForeground#FDF5E688
inputValidation.errorBackground#000000
inputValidation.errorBorder#FDF5E688
inputValidation.errorForeground#FDF5E6
inputValidation.infoBackground#000000
inputValidation.infoBorder#FDF5E688
inputValidation.infoForeground#FDF5E6
inputValidation.warningBackground#000000
inputValidation.warningBorder#FDF5E688
inputValidation.warningForeground#FDF5E6
list.activeSelectionBackground#FDF5E6
list.activeSelectionForeground#000000
list.deemphasizedForeground#FDF5E688
list.dropBackground#FDF5E633
list.errorForeground#FDF5E6
list.filterMatchBackground#000000
list.filterMatchBorder#FDF5E688
list.focusBackground#FDF5E688
list.focusForeground#FDF5E6
list.highlightForeground#FDF5E6
list.hoverBackground#FDF5E688
list.hoverForeground#FDF5E6
list.inactiveFocusBackground#FDF5E633
list.inactiveSelectionBackground#FDF5E633
list.inactiveSelectionForeground#FDF5E6
list.invalidItemForeground#FDF5E6
list.warningForeground#FDF5E6
listFilterWidget.background#000000
listFilterWidget.noMatchesOutline#FDF5E688
listFilterWidget.outline#FDF5E6
menu.background#000000
menu.border#FDF5E688
menu.foreground#FDF5E6
menu.selectionBackground#FDF5E688
menu.selectionBorder#FDF5E688
menu.selectionForeground#000000
menu.separatorBackground#FDF5E688
menubar.selectionBackground#FDF5E633
menubar.selectionBorder#FDF5E688
menubar.selectionForeground#FDF5E6
merge.border#FDF5E688
merge.commonContentBackground#000000
merge.commonHeaderBackground#000000
merge.currentContentBackground#000000
merge.currentHeaderBackground#000000
merge.incomingContentBackground#000000
merge.incomingHeaderBackground#000000
minimap.background#000000
minimap.errorHighlight#FDF5E688
minimap.findMatchHighlight#FDF5E688
minimap.selectionHighlight#FDF5E688
minimap.warningHighlight#FDF5E688
minimapGutter.addedBackground#FDF5E633
minimapGutter.deletedBackground#FDF5E633
minimapGutter.modifiedBackground#FDF5E633
minimapSlider.activeBackground#FDF5E633
minimapSlider.background#FDF5E611
minimapSlider.hoverBackground#FDF5E611
notebook.cellBorderColor#FDF5E688
notebook.cellStatusBarItemHoverBackground#FDF5E611
notebook.cellToolbarSeperator#FDF5E688
notebook.focusedCellIndicator#FDF5E633
notebook.outputContainerBackgroundColor#000000
notebookStatusErrorIcon.foreground#ff0000
notebookStatusRunningIcon.foreground#ff0000
notebookStatusSuccessIcon.foreground#ff0000
notificationCenter.border#FDF5E688
notificationCenterHeader.background#000000
notificationCenterHeader.foreground#FDF5E6
notificationLink.foreground#FDF5E6
notifications.background#000000
notifications.border#FDF5E688
notifications.foreground#FDF5E6
notificationsErrorIcon.foreground#FDF5E6
notificationsInfoIcon.foreground#FDF5E6
notificationsWarningIcon.foreground#FDF5E6
notificationToast.border#FDF5E688
panel.background#000000
panel.border#FDF5E688
panel.dropBorder#FDF5E6
panelInput.border#FDF5E688
panelSection.border#FDF5E688
panelSection.dropBackground#FDF5E611
panelSectionHeader.background#000000
panelSectionHeader.border#FDF5E688
panelSectionHeader.foreground#FDF5E6
panelTitle.activeBorder#FDF5E688
panelTitle.activeForeground#FDF5E6
panelTitle.inactiveForeground#FDF5E688
peekView.border#FDF5E688
peekViewEditor.background#000000
peekViewEditor.matchHighlightBackground#000000
peekViewEditor.matchHighlightBorder#FDF5E688
peekViewEditorGutter.background#000000
peekViewResult.background#000000
peekViewResult.fileForeground#FDF5E6
peekViewResult.lineForeground#FDF5E6
peekViewResult.matchHighlightBackground#000000
peekViewResult.selectionBackground#000000
peekViewResult.selectionForeground#FDF5E6
peekViewTitle.background#000000
peekViewTitleDescription.foreground#FDF5E6
peekViewTitleLabel.foreground#FDF5E6
pickerGroup.border#FDF5E688
pickerGroup.foreground#FDF5E6
problemsErrorIcon.foreground#FDF5E6
problemsInfoIcon.foreground#FDF5E6
problemsWarningIcon.foreground#FDF5E6
progressBar.background#FDF5E688
quickInput.background#000000
quickInput.foreground#FDF5E6
quickInputTitle.background#000000
scrollbar.shadow#FDF5E633
scrollbarSlider.activeBackground#FDF5E633
scrollbarSlider.background#FDF5E633
scrollbarSlider.hoverBackground#FDF5E633
searchEditor.findMatchBackground#000000
searchEditor.findMatchBorder#FDF5E688
searchEditor.textInputBorder#FDF5E688
selection.background#FDF5E688
settings.checkboxBackground#000000
settings.checkboxBorder#FDF5E688
settings.checkboxForeground#FDF5E6
settings.dropdownBackground#000000
settings.dropdownBorder#FDF5E688
settings.dropdownForeground#FDF5E6
settings.dropdownListBorder#FDF5E688
settings.headerForeground#FDF5E6
settings.modifiedItemIndicator#FDF5E688
settings.numberInputBackground#000000
settings.numberInputBorder#FDF5E688
settings.numberInputForeground#FDF5E6
settings.textInputBackground#000000
settings.textInputBorder#FDF5E688
settings.textInputForeground#FDF5E6
sideBar.background#000000
sideBar.border#FDF5E688
sideBar.dropBackground#FDF5E633
sideBar.foreground#FDF5E6
sideBarSectionHeader.background#FDF5E633
sideBarSectionHeader.border#FDF5E688
sideBarSectionHeader.foreground#FDF5E6
sideBarTitle.foreground#FDF5E6
statusBar.background#FDF5E633
statusBar.border#FDF5E688
statusBar.debuggingBackground#FDF5E6
statusBar.debuggingBorder#FDF5E688
statusBar.debuggingForeground#000000
statusBar.foreground#FDF5E6
statusBar.noFolderBackground#000000
statusBar.noFolderBorder#FDF5E688
statusBar.noFolderForeground#FDF5E6
statusBarItem.activeBackground#000000
statusBarItem.hoverBackground#000000
statusBarItem.prominentBackground#000000
statusBarItem.prominentForeground#FDF5E6
statusBarItem.prominentHoverBackground#000000
statusBarItem.remoteBackground#000000
statusBarItem.remoteForeground#FDF5E6
symbolIcon.arrayForeground#FDF5E6
symbolIcon.booleanForeground#FDF5E6
symbolIcon.classForeground#FDF5E6
symbolIcon.colorForeground#FDF5E6
symbolIcon.constantForeground#FDF5E6
symbolIcon.constructorForeground#FDF5E6
symbolIcon.enumeratorForeground#FDF5E6
symbolIcon.enumeratorMemberForeground#FDF5E6
symbolIcon.eventForeground#FDF5E6
symbolIcon.fieldForeground#FDF5E6
symbolIcon.fileForeground#FDF5E6
symbolIcon.folderForeground#FDF5E6
symbolIcon.functionForeground#FDF5E6
symbolIcon.interfaceForeground#FDF5E6
symbolIcon.keyForeground#FDF5E6
symbolIcon.keywordForeground#FDF5E6
symbolIcon.methodForeground#FDF5E6
symbolIcon.moduleForeground#FDF5E6
symbolIcon.namespaceForeground#FDF5E6
symbolIcon.nullForeground#FDF5E6
symbolIcon.numberForeground#FDF5E6
symbolIcon.objectForeground#FDF5E6
symbolIcon.operatorForeground#FDF5E6
symbolIcon.packageForeground#FDF5E6
symbolIcon.propertyForeground#FDF5E6
symbolIcon.referenceForeground#FDF5E6
symbolIcon.snippetForeground#FDF5E6
symbolIcon.stringForeground#FDF5E6
symbolIcon.structForeground#FDF5E6
symbolIcon.textForeground#FDF5E6
symbolIcon.typeParameterForeground#FDF5E6
symbolIcon.unitForeground#FDF5E6
symbolIcon.variableForeground#FDF5E6
tab.activeBackground#FDF5E633
tab.activeBorder#000000
tab.activeBorderTop#000000
tab.activeForeground#FDF5E6
tab.activeModifiedBorder#FDF5E688
tab.border#000000
tab.hoverBackground#FDF5E633
tab.hoverBorder#FDF5E688
tab.hoverForeground#FDF5E688
tab.inactiveBackground#000000
tab.inactiveForeground#FDF5E688
tab.inactiveModifiedBorder#000000
tab.unfocusedActiveBackground#FDF5E633
tab.unfocusedActiveBorder#000000
tab.unfocusedActiveBorderTop#000000
tab.unfocusedActiveForeground#FDF5E6
tab.unfocusedActiveModifiedBorder#000000
tab.unfocusedHoverBackground#FDF5E633
tab.unfocusedHoverBorder#000000
tab.unfocusedHoverForeground#FDF5E633
tab.unfocusedInactiveBackground#000000
tab.unfocusedInactiveForeground#FDF5E688
tab.unfocusedInactiveModifiedBorder#000000
terminal.ansiBlack#fdf5e6ff
terminal.ansiBlue#ece5d7ff
terminal.ansiBrightBlack#fdf5e6ff
terminal.ansiBrightBlue#ece5d7ff
terminal.ansiBrightCyan#a9a399ff
terminal.ansiBrightGreen#cac4b8ff
terminal.ansiBrightMagenta#dbd4c7ff
terminal.ansiBrightRed#bab4a9ff
terminal.ansiBrightWhite#87837bff
terminal.ansiBrightYellow#98938aff
terminal.ansiCyan#a9a399ff
terminal.ansiGreen#cac4b8ff
terminal.ansiMagenta#dbd4c7ff
terminal.ansiRed#bab4a9ff
terminal.ansiWhite#87837bff
terminal.ansiYellow#98938aff
terminal.background#000000
terminal.border#FDF5E688
terminal.foreground#FDF5E6
terminal.selectionBackground#FDF5E633
terminalCursor.background#000000
terminalCursor.foreground#FDF5E6
textBlockQuote.background#000000
textBlockQuote.border#FDF5E688
textCodeBlock.background#000000
textLink.activeForeground#FDF5E6
textLink.foreground#FDF5E688
textPreformat.foreground#FDF5E6
textSeparator.foreground#FDF5E6
titleBar.activeBackground#000000
titleBar.activeForeground#FDF5E6
titleBar.border#FDF5E688
titleBar.inactiveBackground#000000
titleBar.inactiveForeground#FDF5E6
tree.indentGuidesStroke#FDF5E688
walkThrough.embeddedEditorBackground#000000
welcomePage.background#000000
welcomePage.buttonBackground#000000
welcomePage.buttonHoverBackground#000000
widget.shadow#FDF5E633
window.activeBorder#FDF5E688
window.inactiveBorder#FDF5E633

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment	#FDF5E688	—
keyword, storage	#FDF5E688	—
entity, strong	—	bold
invalid	#FDF5E688	italic underline

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