2. Forms

Form

Forms are essential for user interaction, enabling users to enter and submit information seamlessly. Form inputs can be used individually or in combination with other elements to create structured, accessible forms.

Each input should be clearly labeled to guide users on its purpose. This can be done using placeholder text or a visible label to ensure clarity and usability across different devices.

Amazium provides a consistent and responsive form system designed for efficiency, accessibility, and ease of use.

1. Getting started

   The Amazium form system provides consistent, accessible form elements that adapt to different screen sizes. Use the available form components to create intuitive user interactions.

2. Checkbox

   Checkboxes allow users to select multiple options from a list. They are commonly used in settings, preferences, or multiple-choice selections.

3. Label

   Clear labels help users understand what to enter in an input field. Labels should be concise, descriptive, and positioned effectively for readability.

4. Radio

   A radio input allows users to select only one option from a number of choices. Radio is generally displayed in a radio group.

5. Radio - Boxed

   A variation of the radio button, the boxed radio visually emphasizes each option, making selection more distinct and intuitive.

6. Select

   The select component presents a dropdown menu, enabling users to choose one or multiple options from a predefined list.

7. Switch

   Switches provide a toggle-style control for enabling or disabling settings. They offer instant feedback and are great for on/off interactions.

8. Text area

   A multi-line input field for longer text entries, such as comments, descriptions, or messages. Useful when more than a single line of text is required.

9. Text field

   A standard single-line input field for entering short pieces of text, such as names, email addresses, or search queries.

10. Toggle

    Toggles allow users to switch between states, such as enabled/disabled. They are useful for preferences, filters, and visibility controls.