Components
Loading preview...
Pixel-art radio group from 8bitcn.com — chunky pixel frame around each option, retro selected glyph. Native primitive rewrite, no Radix.
npx shadcn@latest add https://21st.dev/r/theorcdev/8bit-radio-group"use client";
import { RadioGroup, RadioGroupItem } from "@/components/ui/8bit-radio-group";
export default function Default() {
return (
<div className="flex w-full min-h-screen items-center justify-center bg-background p-8 overflow-hidden">
<RadioGroup defaultValue="warrior" className="space-y-3">
<div className="flex items-center gap-3">
<RadioGroupItem value="warrior" id="r1" />
<label htmlFor="r1" className="text-sm font-pixel cursor-pointer">Warrior</label>
</div>
<div className="flex items-center gap-3">
<RadioGroupItem value="mage" id="r2" />
<label htmlFor="r2" className="text-sm font-pixel cursor-pointer">Mage</label>
</div>
<div className="flex items-center gap-3">
<RadioGroupItem value="rogue" id="r3" />
<label htmlFor="r3" className="text-sm font-pixel cursor-pointer">Rogue</label>
</div>
</RadioGroup>
</div>
);
}