Input

Text fields allow users to enter text into a UI. They typically appear in forms and modals.

Default Input Box with a required field

            
    <form>
        <label for="name">First Name</label>
        <input class="input" type="name" id="name" name="name">

        <label for="email">Email Id*</label>
        <input class="input" type="email" id="email" name="email" required> 

        <button class="btn btn-primary-solid">Submit</button>
    </form>
            
        

Default Textarea

            
    <form>
        <label for="desc">Description</label>
        <textarea class="textarea" id="desc" name="desc" rows="5"></textarea>

        <button class="btn btn-primary-solid">Submit</button>
    </form>
            
        

Different validation styles

            
    <form>
        <label for="label">Label</label>
        <input class="input warning" type="text">

        <label for="label">Label</label>
        <input class="input success" type="text">

        <label for="label">Label</label>
        <input class="input error" type="text">
    </form>