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_DarkGoldenRod

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

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

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