About this template

What Hearten is

Hearten is a complete website for a therapy or counselling practice, solo or group. Reading about therapy while you are struggling is hard, so the whole site comes at two lengths: a Say more control at the top of every page switches each approach, fee note, step, therapist intro and answer between one line and the full explanation, and remembers the choice.

It has 17 page types: home, a therapist finder that matches by what you want to talk about, approach, language, in person or online and a when-you-can-come grid, a therapist profile with specialisms, languages, formats, sliding scale and a weekly availability grid, how we work, an approach page that says what it is, who it suits and what it feels like, what we help with, fees and insurance with a choose-your-fee sliding scale, your first session, a booking form that asks for contact details only, questions, a crisis page, about, a journal and note, privacy, terms and a 404.

A crisis note sits in every footer, insurance is written in neutral international wording, and the booking buttons can send visitors straight to a scheduler such as Calendly, Cal.com or SimplePractice. Every page is designed in light and in dark and adapts to desktop, tablet and phone. The practice, its people and its prices are invented, and the photographs are for demonstration only, so replace them with your own before you publish.

Last updated

What's included

6 pages, ready to fill in

  1. 01HomeLilac hero, the reading-depth bar, what people come to talk about, three therapists, approaches, three steps, fees and questions
  2. 02Therapists and therapistA finder with concern, approach, language, format and a week grid; each profile with specialisms, approaches, languages, sliding scale and when they see people
  3. 03How we work and approachSix approaches in plain words: what it is, who it suits, what it feels like, and who works that way
  4. 04What we help withEach concern at two lengths with the counsellors who work with it
  5. 05Fees, first session, bookFee table, insurance, cancelling and estimates, a sliding-scale picker; the steps from first call on; a contact-details-only form with a times grid
  6. 06Questions, crisis, about, journal, legal, 404A gentle FAQ, crisis contacts with neutral slots, the practice, notes from the counsellors, privacy, terms and a 404

Features

  • Every text in a brief and a full version, switched site-wide
  • Therapists, approaches and notes in one typed file
  • Booking buttons point to your scheduler with one setting
  • Availability grid shared by profiles, the finder and the form
  • Light and dark mode with a toggle
  • Responsive, with the depth switch and booking pinned on phones
  • Therapists, approaches and journal on the Framer CMS

Code version

  • React 19
  • Vite
  • Tailwind CSS 4
  • TypeScript
  • Motion
  • React Router
  • Content in typed files

Screens

A closer look

Taken from the live demo, in light and in dark, on desktop and on a phone.

Hearten template. Home: one headline, one line and a free first call.
LightHome: one headline, one line and a free first call.
Hearten template. Home in dark mode, the lilac still leads.
DarkHome in dark mode, the lilac still leads.
Hearten template. The same section switched to In full.
LightThe same section switched to In full.
Hearten template. The therapist finder with a when-you-can-come grid.
DarkThe therapist finder with a when-you-can-come grid.
Hearten template. A therapist profile.
LightA therapist profile.
Hearten template. Specialisms, languages and when they see people.
DarkSpecialisms, languages and when they see people.
Hearten template. An approach in plain words, at full length.
LightAn approach in plain words, at full length.
Hearten template. Fees, insurance, cancelling and estimates.
DarkFees, insurance, cancelling and estimates.
Hearten template. Choose a fee you can manage.
LightChoose a fee you can manage.
Hearten template. Booking with contact details only and a crisis note.
DarkBooking with contact details only and a crisis note.
Hearten template. Home on a phone, depth and booking pinned.
Hearten template. A profile on a phone, dark mode.
PhoneHome on a phone, depth and booking pinned. A profile on a phone, dark mode.

Where to get it

Three versions, one design

Pick the one that matches how you build. The pages and the design are the same in each.

  • Framer templateRemix it into your Framer account and edit on the canvas. Projects and journal posts run on the Framer CMS.

    Free on FramerFramer Marketplace

  • Code on Digital Silk RouteThe full source: React 19, Vite, Tailwind CSS 4, TypeScript. Host it anywhere and change anything.

    $5one payment

    Buy theme · $5
  • XOXI themeA theme for your XOXI profile. Live on the XOXI website now; the iOS and Android app gets it with the next app update.

    Includedfor Pro and Business+ members

    Get it with Pro plan on XOXI

Want to see it first? View demo

Want one made for you?

Start with a free 30-minute call. You get a written plan and a fixed quote before any work begins.

Book a call

Fixed quote. You own everything we make.

The Black Momento online store, built by Victor Studios
Client work, designed and built by us