Forms & Inputs

Form components from the iota Design System

Form Input (No Label/No Dropdown/No CTA)
Basic text input states

Default

Focused

Filled

Disabled

Error

Error message

Form Input with Label
Text input with label states

Error message

Form Input with Dropdown
Input with dropdown indicator

Error message

Form Input with Icon (Right)
Input with icon on the right

Error message

Form Input with Label & Icon
Input with label and icon on the right

Error message

Password Input
Password input with visibility toggle

Hide password

Password too weak

Phone Input
Phone input with country code

Invalid phone number

Phone Input with Label

Invalid input

Search (No Label/No Icon)

Default

Focused

Filled

Hover

Disabled

Error

Search with Icon
Search (No Label/With Icon)
Search with Icon & CTA
Search with Label
Search input with label variations
Select / Dropdown
Select input with options

Error message

Dropdown Menu
Menu item states

Default States

Selected State

Item States

Default

Hover

Disabled

Selected

Pressed

With Notification

Small Items (Checked/Unchecked)

Unchecked

Item

Checked

Menu and Item Variations

With Background

Placeholder

With Border

Placeholder

Menu Item Checkbox