Keyboard interaction
| Key | Action |
|---|---|
| Tab | Moves into the group, to the checked star. |
| Arrow keys | Change the rating. |
| Space | Checks the focused star. |
Accessibility notes
- Each star is a native radio named “3 stars”. Name the group with
aria-label. - Read-only, the rating is an image (
role="img") named “Rated 4.3 out of 5”. - Stars are drawn with CSS masks, so they follow forced colors.