Forms and UI states

Forms and UI states

Style form controls consistently but preserve clear labels, error messages and focus states. Use valid and invalid states carefully, and explain how to correct an error in text rather than relying only on color.

Try it yourself

Change the example, run it, and explain the result in your own words. Then create one variation of your own.

Key idea

Use the example as a starting point, not something to memorize. Practise, inspect the result and make small improvements.