Touch target size: 44px minimum

Apple's HIG, WCAG 2.5.5, and Material all agree

Interactive elements must be at least 44 × 44 CSS pixels to be reliably tappable. Smaller targets are physically hard to hit for users with limited fine motor control or large fingers, and they're a common cause of "I tapped the wrong button."

button, a {
  min-width: 44px;
  min-height: 44px;
  padding: 8px 12px;     /* combined with line-height, gets you to 44 */
}

The icon-button trap

<!-- 24px icon = 24px target. BAD. -->
<button><svg width="24" height="24">…</svg></button>

Fix: pad the button so its hit area is 44×44, even though the visual icon is 24×24:

button.icon {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
}

Spacing between targets

Two 44px buttons RIGHT next to each other still risk mis-taps. Industry rule: at least 8px between adjacent interactive elements.

When 24px IS OK

Dense desktop UIs (data tables with action icons, code editors) sometimes use smaller targets because the user is on a mouse with pixel-precision pointing. WCAG carves out an exception ("the target is part of a sentence or block of text"). For mobile-first or general-purpose UI, 44px is the floor.