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_MediumAquaMarine

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

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

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