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_LavenderBlush

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

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

scope	foreground	fontStyle
comment	#FFF0F588	—
keyword, storage	#FFF0F588	—
entity, strong	—	bold
invalid	#FFF0F588	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}!`;
}