Radio
A customizable radio button component for selecting one option from a group.
How was your experience?
import { Radio, RadioGroup, RadioIndicator } from "@/components/ui/radio/radio";
import styles from "./radio-demo.module.css";
export default function RadioDemo() {
return (
<div className={styles.container}>
<RadioGroup aria-label="Select a size">
<div className={styles.title}>How was your experience?</div>
<label className={styles.item}>
<Radio value="pleasant">
<RadioIndicator />
</Radio>
Pleasant
</label>
<label className={styles.item}>
<Radio value="neutral">
<RadioIndicator />
</Radio>
Neutral
</label>
<label className={styles.item}>
<Radio value="unpleasant">
<RadioIndicator />
</Radio>
Unpleasant
</label>
</RadioGroup>
</div>
);
}
npx shadcn@latest add @roiui/radionpx shadcn@latest add @roiui/radio-tailwindanatomy
<RadioGroup>
<Radio>
<RadioIndicator />
</Radio>
</RadioGroup>