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_GreenYellow

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

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

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