RetroSlider

A range slider with Mac OS 9 inset track and rectangular beveled thumb.

Installation

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

Import

import { RetroSlider } from "@/components/ui/retro-slider"

Default

Controlled (value: 50)

Custom Range (0-10, step 1)

Disabled

Full Width

Drag the rectangular thumb to adjust values. The track uses OS9 inset bevel styling.