# Forms & Inputs

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

***

<figure><img src="https://3302412606-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FPzuLy4HwYJtL2cvBab9d%2Fuploads%2FS7nBMjF3cFgMKM0c4nHj%2FScreenshot%202026-03-19%20at%2015.16.47.png?alt=media&#x26;token=e0dd80ab-5064-452a-a397-fa3dc8e8bed8" alt=""><figcaption></figcaption></figure>

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

#### What you can customize

<figure><img src="https://3302412606-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FPzuLy4HwYJtL2cvBab9d%2Fuploads%2FK0X89ExGiofvTcO5jWPN%2FScreenshot%202026-03-19%20at%2015.17.07.png?alt=media&#x26;token=dc5ab09f-10e5-4d4d-b8ac-adcff6eedcf8" alt=""><figcaption></figcaption></figure>

**Input**&#x20;

* 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

{% hint style="info" %}
When you define a custom background or text color, we do a [WCAG color contrast check](https://accessibleweb.com/color-contrast-checker/), and you're only able to save the color if contrast is higher than 3:1.
{% endhint %}

**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.