Forms & Inputs

Forms & Inputs define how users interact with fields such as text inputs, dropdowns, and multi-line fields.

---

You can customize normal inputs and multiline separately. The normal input styling also covers inputs like dropdowns.

What you can customize

Input

• Background color

• Border style (none, solid, dotted, dashed, groove, ridge, inset, outset)

• Border width (in px)

• Border radius (in px)

Text Styling

• Input text color

• Placeholder text color

When you define a custom background or text color, we do a WCAG color contrast check, and you're only able to save the color if contrast is higher than 3:1.

States

• Default state

• Hover state is customizable separately - simply toggle the hover toggle and customize any setting

• Darkmode is also customizable separately - select Yes for different style in darkmode and edit any settings while having either dark/light mode selected

Typography

• Custom font for inputs - this is an optional override the global font.