# Forms Void form elements use translucent glass backgrounds with subtle borders. Labels are mono uppercase; inputs, textareas, and selects share a consistent look. Validation states add colored borders paired with hint text. !!! tip Form controls are interactive out of the box via `initUIExamples()`: submitting a form fires a success or error toast, and pressing Enter or changing an input/select fires a toast confirming the action. ## Text input
```html ``` ## Textarea
```html ``` ## Select
```html ``` ## Validation states Add `--error` or `--success` modifier classes to inputs and textareas. Always pair color with a hint so the meaning is clear without relying on color alone.
Minimum 3 characters
Email looks good
```html Minimum 3 characters Email looks good ``` ## Full form A complete form using vertical flex layout with consistent spacing. It is a real `
` — try submitting it empty to see validation in action.
```html
``` The `initUIExamples()` initializer handles the submit: it validates any `[required]` field, toggling the `--error` class and showing the paired error hint when empty. The submit button turns green (`.void-form--valid`) when everything is filled in.