Briefle words · UI design
Touch target
The area of a control that responds to a tap or click; platform guidelines ask for roughly 44 to 48 pixels square.
Say it to an AI
Mobile food-delivery cart: item rows with quantity steppers, a subtotal, and checkout. Every minus and plus gets at least a 44px touch target, and checkout is a full-width sticky footer CTA showing the total, down in the thumb zone. Nothing important lives in the header.
How an expert would brief the stronger version of “Mobile cart”.
See it
Try it as a puzzle →Cart screen of a food delivery app, shown at phone width.
Why: B's minus and plus buttons are 44px squares; A's are 20px circles, less than half the recommended size.
More ways experts use it
Event card with a filled primary CTA 'Register' next to an outlined secondary 'Add to calendar'. Give both generous padding, around 20px on the sides with a 40px height, so they read as real buttons and make comfortable touch targets.
Event RSVP card · UI designNotification settings panel with three toggle rows. Be generous with whitespace: roomy padding around the panel and every row, all on an 8px spacing scale, so each label, description and toggle reads as its own calm touch target. Let the panel grow taller rather than tighten.
Settings panel · UI design
Related words
Room 1 · Essentials
Learn “Touch target” in a five-minute lesson