Safe Space is a one-page Framer template built for therapists, counsellors, and mental health practices. The hero; Each character sits composed and smiling in the group photo; hover over one, and their expression gives way to what they're actually feeling underneath. It's a small interaction, but it turns the site's central idea into something visitors experience in the first few seconds, before they've read a single line of copy.
Design The aesthetic is warm and editorial rather than clinical. The hero uses a layered, collage-style composition — a base photograph with individual cutout portraits floating above it — paired with an intimate, oversized headline. Italicized pull-quotes, generous whitespace, and slow, unhurried section breaks carry that same emotional pacing down the page. Therapist photography is natural and portrait-led rather than posed stock imagery, keeping "Meet the Team" feeling personal instead of corporate.
Structure (single page, anchor-linked navigation)
Nav — sticky bar linking to Recognition, How It Works, Meet the Team, and FAQ
Hero — layered portrait imagery + "Everyone's smiling. Not everyone's okay." headline
Recognition — italic pull-quote and narrative copy that names the feeling before offering the solution
How It Works — 4-step process (Reach Out → Just a Conversation → Just Enough → Just a Beginning), each with a short, vulnerable first-person caption
Meet Our Professionals — 3 therapist profiles with photo, credentials, specialty, bio, and a "Work with me" CTA
FAQ — 4 common questions answered in a reassuring, low-pressure tone
How Are You Feeling Today? — a row of six mood/emotion icons
Closing CTA — contact/booking block
Footer — credit + branding
Fully responsive · Built in Framer using code components — fully customizable from the right-side properties panel, no code editing needed · Component-based sections, easy to reorder or remove · Simple to rebrand with your own photos, copy, and team bios
Safe Space is a one-page Framer template built for therapists, counsellors, and mental health practices. The hero; Each character sits composed and smiling in the group photo; hover over one, and their expression gives way to what they're actually feeling underneath. It's a small interaction, but it turns the site's central idea into something visitors experience in the first few seconds, before they've read a single line of copy.
Design The aesthetic is warm and editorial rather than clinical. The hero uses a layered, collage-style composition — a base photograph with individual cutout portraits floating above it — paired with an intimate, oversized headline. Italicized pull-quotes, generous whitespace, and slow, unhurried section breaks carry that same emotional pacing down the page. Therapist photography is natural and portrait-led rather than posed stock imagery, keeping "Meet the Team" feeling personal instead of corporate.
Structure (single page, anchor-linked navigation)
Nav — sticky bar linking to Recognition, How It Works, Meet the Team, and FAQ
Hero — layered portrait imagery + "Everyone's smiling. Not everyone's okay." headline
Recognition — italic pull-quote and narrative copy that names the feeling before offering the solution
How It Works — 4-step process (Reach Out → Just a Conversation → Just Enough → Just a Beginning), each with a short, vulnerable first-person caption
Meet Our Professionals — 3 therapist profiles with photo, credentials, specialty, bio, and a "Work with me" CTA
FAQ — 4 common questions answered in a reassuring, low-pressure tone
How Are You Feeling Today? — a row of six mood/emotion icons
Closing CTA — contact/booking block
Footer — credit + branding
Fully responsive · Built in Framer using code components — fully customizable from the right-side properties panel, no code editing needed · Component-based sections, easy to reorder or remove · Simple to rebrand with your own photos, copy, and team bios
