Shadcn Radio Group Card Separators

When to use

• Short single choice lists in forms and settings, such as density, visibility, role or release channel
• Option tiles and divided card rows for shipping speed, contact method, language or a teammate
• Checkout and plan steps that pick one saved payment method or one priced subscription tier

When not to use

• Separate outlined tiles, each with a short pitch under its title: use the Radio Group Descriptive Cards example
• Rows that open on a channel icon and end with the dot: use the Radio Group Card Icons example
• A list where any number of the options can be ticked together: use the Checkbox component
• A whole modal step built around one choice, such as a template or a sync scope: use the Dialog blocks
• A full plan table with billing period tabs and a feature list per tier: use the Pricing blocks

Agent notes

• Every example seeds RadioGroup through defaultValue and reads nothing back; pass a controlled value and a change handler to act on the pick
• No example sets a name on RadioGroup, so a native form post carries no choice; add one when the group lives in a form
• Every RadioGroupItem id is a fixed string such as r1 or an option value; derive unique ids when a group can render twice on one page