Forms & settings pages

Forms

• Labels sit above fields, always visible; placeholders show format examples, never carry instructions.
• Help text goes below the field in --text-muted; it is replaced by the validation message on error.
• Validate on blur or submit; never mid-keystroke.
• One primary submit button, placed at the end of the flow; destructive alternatives live elsewhere.
• Long forms group into titled sections; nothing essential hides behind a collapsed group.

Settings pages

Settings use the row pattern: leading icon (optional), label + description, trailing control, grouped under an uppercase group title.

• Rows describe effect, not mechanism (“Check for updates automatically”, not “Run pacman -Syu via timer”).
• A switch means the effect applies immediately; if a Save step is needed, it's a checkbox.
• Every setting has a visible effect, no dead toggles.
• Searchable settings pages expose row titles to search.

Live demo: App shell → Settings rows and the Settings mock.