Input Components
Components for user input and interaction:Form Controls
- Buttons - Primary interaction components with multiple variants and sizes
- Text Fields - Single and multi-line text input with validation
- Checkboxes - Binary and tristate selection controls
- Radio Buttons - Single selection from multiple options
- Toggle Buttons - Switch-style on/off controls
- Sliders - Value selection from a continuous or discrete range
- Dropdowns - Select from a list of options
- Date Pickers - Date and time selection components
Design Principles
All Chromia UI components follow these core principles:Consistency
Components share common patterns for variants, sizes, and states, making them predictable and easy to use.Accessibility
Built-in support for keyboard navigation, screen readers, and touch targets that meet accessibility guidelines.Customization
Flexible styling through custom style objects while maintaining design system coherence.Theming
Automatic adaptation to theme changes with full support for light and dark modes.Common Patterns
Variants
Many components support multiple visual variants:filled- Solid background (default)outlined- Border with transparent backgroundtext- Minimal styling, no backgroundtonal- Subtle background fillelevated- Shadow elevation
Sizes
Most components offer three size options:small- Compact size for dense layoutsmedium- Default balanced sizelarge- Prominent size for emphasis
States
All interactive components handle these states automatically:- Default
- Hover
- Pressed/Active
- Focused
- Disabled
- Error (where applicable)