Inputs
13 components in Inputs, each with an animated preview.
13 components
Character Count Text EditorA multiline text field with a placeholder, a ring that fills toward the limit and a count that turns orange near it and red past it.
Clearable Text FieldA text field with a leading symbol, a clear button that keeps the focus, a tinted border while editing and an optional error message.
Color Swatch PickerA grid of selectable color swatches where the chosen one grows a ring.
Floating Label Text FieldA text field whose placeholder floats up when it gains focus or has text.
Masked Text FieldA text field that formats input as the user types, such as 12/34 or a phone number, using a mask.
Multi Step FormA multi-step form with a progress bar that moves forward only when the current step is valid.
OTP Code FieldA one-time code field with one box per digit, backed by a single hidden text field.
Passcode KeypadA number pad with a dot per digit that shakes and empties when the passcode is wrong.
Password Strength FieldA password field with a strength meter and a checklist of rules that tick off as they are met.
Rich Text EditorA text editor with a bar to make the selection bold, italic, underlined, struck through or highlighted.
Search Field With SuggestionsA search field that lists matching suggestions as the user types and fills the field when one is chosen.
Tag Input FieldA field that turns what you type into removable tags, which wrap onto as many lines as they need.
Validated Text FieldA text field that checks its value when it loses focus and shows its error only after that.
No component matches. Try fewer words, or clear the filters.