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_MediumSeaGreen

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

tokenColors

TextMate scopes and font styles (syntax highlighting rules).

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