Forms

Text field

Default text field

This is the input's helper text.
<div class="ecl-form-group"><label for="example-input-id-1" id="example-input-id-1-label"
    class="ecl-form-label">Label<span class="ecl-form-label__optional">(optional)</span></label>
  <div class="ecl-help-block" id="example-input-id-1-helper">This is the input's helper text.</div><input
    id="example-input-id-1" class="ecl-text-input ecl-text-input--m" type="text" placeholder="Placeholder text"
    aria-describedby="example-input-id-1-helper" />
</div>

Try it yourself on the playground

Playground

Disabled text field

This is the input's helper text.

Try it yourself on the playground

Playground

Invalid text field

This is the input's helper text.

Try it yourself on the playground

Playground

Required text field

This is the input's helper text.

Try it yourself on the playground

Playground