Radio Group
A set of checkable buttons where only one can be checked at a time. Built on Base UI Radio primitive.
Installation
npx shadcn add radio-group --registry https://ui.ch.sh/r
Usage
import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group"
import { Label } from "@/components/ui/label"
export default function Example() {
return (
<RadioGroup defaultValue="a">
<div className="flex items-center gap-2">
<RadioGroupItem value="a" id="a" />
<Label htmlFor="a">Option A</Label>
</div>
<div className="flex items-center gap-2">
<RadioGroupItem value="b" id="b" />
<Label htmlFor="b">Option B</Label>
</div>
</RadioGroup>
)
}