Selected radio buttons are still colored even when disabled

[crnhrv]

Steps to reproduce

Link to live example: https://stackblitz.com/edit/react-sehce7?file=Demo.tsx

Steps:

1. Add a RadioGroup to a FormControl
2. Add FormControlLabel with control={<Radio disabled />}

Current behavior

The disabled selected radio button will display with primary colour:

Expected behavior

The disabled selected radio button will be greyed out:

Context

No response

Your environment

npx @mui/envinfo

  System:
    OS: macOS 14.6.1
  Binaries:
    Node: 22.1.0 - ~/.nvm/versions/node/v22.1.0/bin/node
    npm: 10.7.0 - ~/.nvm/versions/node/v22.1.0/bin/npm
    pnpm: Not Found
  Browsers:
    Chrome: 128.0.6613.114
    Edge: 128.0.2739.54
    Safari: 17.6

Search keywords: radiogroup, radio

[github-actions]

This issue has been closed. If you have a similar problem but not exactly the same, please open a new issue.
Now, if you have additional information related to this issue or things that could help future readers, feel free to leave a comment.

Note

We value your feedback @crnhrv! How was your experience with our support team?
If you could spare a moment, we'd love to hear your thoughts in this brief Support Satisfaction survey. Your insights help us improve!