Headspace — Steps / How-it-works
Section title with a 3x2 grid of bordered selector rows (Stress less, Sleep soundly, Manage anxiety, Process thoughts, Practice meditation, Start therapy) each with a colored mascot icon and chevron.
This is a static, crawlable rendering for search & AI engines. The interactive version — filters, live decode console, copy & export — is at https://mozaika.design/inspiration/headspace-what-kind-of-headspace-are-you-looking-for-grid.
Palette
#FFFFFF#1A1A1A#FF7A45
Fonts
Headspace Apercu
Page types
Detail
UX patterns
Filter & Sorting
UI elements
Card
Context
- Parent page: Headspace consumer mental-health landing with twin app/therapy cards and playful 3D mascots
- All of Headspace
Other sections on this page
- Banner — HSA/FSA pre-tax eligibility promo bar
- Hero — Centered hero with twin app vs therapy cards
- Feature — Tabbed 'every moment' yellow carousel
- Testimonial / Social Proof — Members enjoying happier lives quotes
- Logo Wall — Brand logo row over '4,000 organizations' blue block
- Banner — 'find some headspace' yellow marquee
- Gallery / Showcase — Explore our library filterable card row
- Stats / Metrics — Sky-blue 'Join the millions' stats panel
- FAQ — Frequently asked questions accordion