Radio Buttons
A button in the context of web and application development refers to an interactive UI element designed to trigger an action when clicked or tapped by a user. It serves as a control element that allows users to perform tasks, navigate, or interact with an application or website.
Key Characteristics:
- Clickable: Responds to user interaction, typically via mouse click, keyboard focus, or touchscreen tap.
- Label/Content: Contains text, icons, or both to indicate its purpose (e.g., "Submit," "Cancel," or a search icon).
- Styling: Often styled with borders, background colors, hover effects, and more to stand out as interactive.
-
States: May visually change to represent different states, such as:
- Default: Normal appearance when idle.
- Hover: Slight change when the user hovers over it.
- Active/Pressed: A visual effect when clicked.
- Disabled: A non-interactive state, often grayed out.
Radio Buttons
4-Point Grid System is a framework for designing and laying out user interfaces using increments of 4 pixels (or points) for spacing, sizing, and positioning elements. It ensures consistency, alignment, and balance in the visual design, making interfaces more predictable and easier to scale across different screen sizes.
-
1Button Size: 16W x 16H
-
2Radio Button and text Space: 8px
-
3Border Stroke: 1.5px
-
3Font Size: 16px Regular