Radio cards
Selectable option cards with a sliding selection ring, price and description slots, and radio keyboard behavior.
Choose one option from a visible set.
npx shadcn@latest add @silicon-ui/radio-groupnpx shadcn@latest add @silicon-ui/radio-groupInstall the dependencies.
npm install motionCopy these files into your project. Shared files are skipped if you already have them.
components/silicon-ui/radio-group/radio-group.tsxcomponents/silicon-ui/radio-group/radio-group.module.cssInstall the foundation once per app for the design and motion tokens: npx shadcn@latest add @silicon-ui/silicon-foundation
| Prop | Type | Default |
|---|---|---|
label* | string | — |
options* | { value: string; label: string; description?: string }[] | — |
value* | string | — |
onValueChange* | (value: string) => void | — |
name | string | — |