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.

GitHub

Color themes

VS Code preview

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

OhLED Themes (142-in-1) — OhLED_DodgerBlue

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

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

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