Control Panel

The Appearance control panel: Themes, Appearance, Fonts, Desktop, Sound and Options tabs built from group boxes, pop-ups, sliders, checkboxes, radio buttons and little-arrows fields.

Installation

npx shadcn@latest add "https://nostalgia-ui.com/r/control-panel.json"

Import

import { ControlPanelBlock } from "@/components/control-panel"
Appearance

Click a theme to change the appearance of your computer. A theme sets the highlight colour, desktop pattern, fonts and sounds.

Mac OS Default
Mac OS HiContrast
Drawing Board
Gizmo
Sensible
Cafe
{
  "theme": "mac-os-default",
  "appearance": "platinum",
  "highlightColor": "lavender",
  "variation": "blue",
  "largeFont": "Charcoal",
  "smallFont": "Geneva",
  "viewsFont": "Geneva",
  "viewsFontSize": 10,
  "smoothFonts": true,
  "smoothFontsMinSize": 12,
  "desktopPattern": "mac-os-default",
  "soundTrack": "platinum",
  "sounds": {
    "menus": true,
    "windows": true,
    "controls": true,
    "finder": false
  },
  "volume": 60,
  "smartScrolling": true,
  "collapseOnDoubleClick": true,
  "scrollArrows": "together",
  "menuBlinks": 1
}
View sourceAll blocks