Default and standard spacing for radio buttons.
Compact spacing for radio buttons.
Custom styles for radio buttons.
To ensure that usage of this component complies with accessibility guidelines:
- Each radio button must be focusable and keyboard accessible:
- When radio button has focus, the Space key changes the selection
- Tab key moves to next element in list
- Fieldsets should be:
- Used when associating group of radio buttons
- Identified or described as a group using a
- Avoid nested fieldsets
- Custom radio buttons maintain accessibility requirements. The radio button icon is only visually hidden and replaced with custom style
This component has compliance with WCAG guidelines by:
- Wrapping the input in a label element and label is automatically associated with it
For more information, review techniques and failures for: