
Switch
Toggles
Search by name, tag, category or type
Source and install need .
pnpm dlx shadcn@latest add @assembli/radio-groupThe everyday radio group: a hairline ring that fills with primary and a dot that springs in, labels with descriptions, vertical or horizontal layout, three sizes, disabled options and an error state under a fieldset legend. Also exports RadioList, bordered rows with a right-aligned price and a tinted selected row. Built on Base UI, arrow keys included.
Other props pass through to the root element.
legend
React.ReactNode
The group's visible name, rendered as the fieldset legend.
description
React.ReactNode
A quieter line under the legend.
error
React.ReactNode
Marks every radio invalid and shows this message under the group.
size
Size
className
string
children
React.ReactNode
orientation
"vertical" | "horizontal"
Default "vertical"
Stack the options (default) or lay them out in a wrapping row.
| Prop | Type | Default | Description |
|---|---|---|---|
| legend | React.ReactNode | – | The group's visible name, rendered as the fieldset legend. |
| description | React.ReactNode | – | A quieter line under the legend. |
| error | React.ReactNode | – | Marks every radio invalid and shows this message under the group. |
| size | Size | – | |
| className | string | – | |
| children | React.ReactNode | – | |
| orientation | "vertical" | "horizontal" | "vertical" | Stack the options (default) or lay them out in a wrapping row. |