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_SeaGreen

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

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

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