# Radio group: Disabled and read-only

> Disable a single option, or make the whole group `readOnly` to show a value that can't change.

Example: https://hextaui.com/docs/radio-group/examples/states
Component docs: https://hextaui.com/docs/radio-group.md

## Add this example

```bash
npx shadcn@latest add https://hextaui.com/r/radio-group-states.json
```

This adds `components/examples/radio-group/states.tsx` with the Radio group component and the HextaUI theme tokens.

## Source

```tsx title="components/examples/radio-group/states.tsx"
import { RadioGroup, RadioGroupItem } from "@/components/ui/radio-group"

export function RadioGroupStates() {
  return (
    <div className="flex flex-wrap gap-12 text-sm">
      <RadioGroup aria-label="Theme" defaultValue="system" className="w-fit">
        <label className="flex items-center gap-3">
          <RadioGroupItem value="light" />
          Light
        </label>
        <label className="flex items-center gap-3">
          <RadioGroupItem value="dark" disabled />
          Dark (coming soon)
        </label>
        <label className="flex items-center gap-3">
          <RadioGroupItem value="system" />
          System
        </label>
      </RadioGroup>
      <RadioGroup
        aria-label="Region"
        defaultValue="eu"
        readOnly
        className="w-fit"
      >
        <label className="flex items-center gap-3">
          <RadioGroupItem value="us" />
          United States
        </label>
        <label className="flex items-center gap-3">
          <RadioGroupItem value="eu" />
          Europe (locked)
        </label>
      </RadioGroup>
    </div>
  )
}
```

## Props in this example

### RadioGroup

| Prop | Type | Default | Description |
| --- | --- | --- | --- |
| `defaultValue` | `Value` | – |  |
| `readOnly` | `boolean` | `false` |  |

### RadioGroupItem

| Prop | Type | Default | Description |
| --- | --- | --- | --- |
| `value` | `Value` | – |  |
| `disabled` | `boolean` | `false` |  |

## More Radio group examples

- [Cards](https://hextaui.com/docs/radio-group/examples/cards.md)
- [Horizontal](https://hextaui.com/docs/radio-group/examples/horizontal.md)
- [Form](https://hextaui.com/docs/radio-group/examples/form.md)
- [Controlled](https://hextaui.com/docs/radio-group/examples/controlled.md)
- [Right to left](https://hextaui.com/docs/radio-group/examples/rtl.md)