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_DarkKhaki

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

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

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