Input Radio
Last updated
What is Input Radio?
An input radio is a form element used for selecting one option from a list.
- Checked State: Used when the radio is selected and will use its value for the form submission. A radio input can’t be unselected by pressing it again.
- Disabled State: Prevents radio interactions and removes its value from the form submission.
- Label: There should be a text label linked with the radio field. Clicking the label should also trigger the radio selection.
- Error State: The error state is used for form validation errors when the error is related to the radio field only. Always use a text error along with changing the colour of the field.
- Keyboard State: A radio selection should be triggered when the Space key is pressed. Using native elements for this should provide this kind of interaction out of the box.
- Radio Group: Radio inputs should always be used in a group. If one of them is selected, it can be deselected only by choosing another radio.
More in stage 9: Project Management
- Project Management
- Avatar
- Input Text
- Banner
- Input Checkbox
- Badge
- Button
- Input Switch
- Card
- List
- Carousel
- Loading Indicator
- Dropdown
- Modal
- Icon
- Tabs
- Select
- Toast
- Textarea
- Tooltip
- Component Catalog
- Documentation
- Code Style
- Unit Testing
- Accessibility Testing
- Semantic Versioning
- Release Strategy
- Commit Guidelines
- PR Templates
- Contribution Guidelines
- Roadmap
- Milestones
- Ticketing
- Component Analytics
- Logging
- Tooling Analytics
- Service and Health Metrics
- Community Meetings
- Communication Channel
- Open Hours
- FAQs
Input Radio: common questions
Can I learn Input Radio in Hindi?
This lesson is written in English. Once you sign in, open it in the interactive course and ask the AI tutor to explain Input Radio in Hindi or Hinglish. The tutor answers from this lesson’s own text, so it stays on the syllabus, and it runs on your own Google, OpenAI or Anthropic key.
Is this Input Radio tutorial for beginners?
It is lesson 89 of 124 in the free Design System roadmap, in stage 9, Project Management. If you are new to Design System, start from stage 1 and come back here in order; if you already know the earlier stages, this lesson stands on its own.