Health & fitness app design
Calm and reassuring. One clear focus per screen; reduce load on a tired user.
- Typeface ·
- Warm humanist sans, open counters (Lato-type)
- Hero ·
- 32–44px
- Body ·
- 16–18px, line-height 1.6
- Numerals ·
- Proportional (tabular for vitals/streaks)
Soft → pill (12px+) — calm, gentle
Pick one and apply it to every card, button, input, and modal. Mixing sharp and round corners is the #1 tell of un-designed UI.
Soft accent, vivid only for metric rings/progress on a calm base. Reds only for real alerts.
Low-medium. One focus per screen (today's rings, next action).
Big friendly numbers (2:1), gentle labels, generous spacing.
Float (weightless) for reveals; Pulse only for live heartbeat. Never urgent.
Activity rings, big-metric hero, streak/progress, large touch targets, weekly history.
Avoid in health, wellness & fitness
- dense data dumps
- alarming colors for normal states
- tiny targets
- shame-y empty states
Build it with StyleSeed
StyleSeed bakes this judgment into 74 rules your AI reads automatically. For health, wellness & fitness, start from the Toss skin and the float motion seed.