Accessibilityintermediate
Every input needs a label and every interactive thing needs to work from the keyboard — this is the difference between a demo and something a real person can use.
Build a contact form with focus states and proper vertical rhythm.
Published in full, before you start — every point is one of these and there is nothing else.
Every input needs a label and every interactive thing needs to work from the keyboard — this is the difference between a demo and something a real person can use.
Padding is the breathing room inside a box; without it text touches its own border and everything looks amateur, no matter how good the colours are.
Gradients, rounded corners and shadows are what separate "a box" from "a card" — they are three properties and they do most of the work in modern UI.
Layout is how you decide where things sit on the page — flexbox is the tool for a row or column of items, and gap is how you space them without fighting margins.
A :hover style tells the user something is clickable, and a transition stops that change from snapping — together they are the cheapest way to make a page feel built rather than assembled.