A control element used to allow users to make a single selection from a predefined set of mutually exclusive options.
Can be controlled or uncontrolled
Full keyboard navigation
Simplified API
Handles invalid appearance
Multiple sizes
Easy to customize
Respects reduce motion with system settings and through props
There’s an additional RadioGroupField
component built specifically for easy and clean isomorphic form validation. It leverages Conform and Zod, providing a single source of truth for both frontend and backend while preserving native browser validation APIs (Conform works with any valid HTML form and captures form values using the FormData Web API). It also seamlessly integrates with the latest React 19 useActionState
hook:
Prop | Type | Default |
---|---|---|
size | enum | "default" |
invalid | boolean | ― |
reduceMotion | boolean | false |
options* | RadioOption[] | ― |
Prop | Type | Default |
---|---|---|
size | enum | "default" |
invalid | boolean | ― |
reduceMotion | boolean | false |
Support all Root
Radix API.
Support all Item
Radix API.
Support all Indicator
Radix API.