Breathe - Playful Mindfulness Landing Page Template

Quick summary

Breathe is a colorful, single-column landing page for a kids mindfulness competition and league. It guides visitors through the full season journey, shows what children aged 5 to 12 learn, and converts interest into bookings through an inline scheduler and a team registration form. The mood is playful, warm, and purposeful.

Who this template is for

This template suits anyone running or promoting a structured mindfulness program for children. It speaks equally well to individual families and to institutional buyers.

• Parents of children aged 5 to 12 who want a structured emotional wellness activity
• School counselors searching for a program that goes beyond informal wellness events
• Rec-league directors who want to pair physical play with emotional skill-building

What problem this template solves

Many kids wellness programs struggle to communicate their value clearly online. Parents see a vague description and leave without booking. This template solves that by making the season arc visible and the booking path frictionless.

• Visitors leave before booking because they cannot picture how a season works
• Counselors and directors need a team registration path separate from parent signups
• Mobile visitors miss the call to action because it is buried below the fold

What you get with this template

You get a complete, ready-to-customize landing page that handles two distinct conversion goals in one scroll. Every section is designed to move a specific audience segment toward action.

• A Lottie-style animated hero with a typewriter headline and a primary "Book a Free Trial Class" call to action
• A step-by-step season arc section with alternating warm and cool backgrounds guiding visitors through four phases
• An inline age-group scheduler, a mid-page team registration form, a testimonials strip, and a linear single-row footer

Feature list

This template is built around five purposeful design and interaction layers. Each one serves the booking-first goal of the page.

Animated Hero with Typewriter Headline

Soft geometric shapes breathe in and out using CSS animation while a cartoon child sits cross-legged at center. The headline types itself in rounded indigo letters, communicating the program's spirit before a visitor reads a single word.

Inline Age-Group Scheduler

A booking widget embedded directly on the page lets visitors choose from three age groups (5 to 7, 8 to 10, and 11 to 12), select a day of the week, and pick an in-person or virtual session. No redirect needed to start the booking process.

Step-by-Step Season Arc

Four numbered sections walk visitors through Discovery Session, Skill Building Weeks, Friendly Challenges, and Championship Circle. Each phase features a looping vector illustration and a short paragraph. Section backgrounds alternate between peach warmth and violet cool to reinforce a sense of progression.

Skill Cards in Bento Grid

A bento-style asymmetric card grid highlights the four core skills kids develop: breathing, focus, gratitude, and stillness. Cards use scroll-triggered reveals and staggered entry animations for a lively, layered feel.

Mid-Page Team Registration Form

A dedicated secondary conversion block targets counselors and league directors. A short inline form collects group size, age range, and preferred start date without sending visitors to a separate page.

Testimonials and Social Proof Strip

A horizontal-scroll testimonials section carries quotes from parents and counselors alongside league stats such as kids enrolled, schools partnered, and seasons completed. The strip builds trust at the moment visitors are closest to committing.

Page sections overview

Design & branding system

The visual identity is built on a Playful Geometric theme with a Sunset Gradient color palette. Every design decision reinforces the program's tone: competitive energy wrapped in softness.

• Colors run from warm peach (#FFAD85) through coral (#FF6B6B) and soft violet (#C490E4) to grounding indigo (#4A3F8A) for headlines and the footer
• Typography pairs Fraunces display headlines with Manrope body and interface text for a friendly, readable feel
• Rounded shapes, soft gradients, and geometric background elements grow more complex as the scroll deepens, visually mirroring a child's learning progression

Mobile & speed optimization

The template is built mobile-first, with layout decisions made for smaller screens before scaling up to desktop. Booking access is never more than a thumb-tap away.

• A sticky bottom call-to-action bar appears on mobile so the "Book a Free Trial Class" button stays visible throughout the entire scroll
• Static sections use server-side rendering while interactive components like the scheduler and animations load as client-side elements to keep the page feeling responsive
• Scroll-triggered reveals and staggered card animations fire only when elements enter the viewport, keeping the experience smooth on lower-powered devices

How this template helps you convert

The conversion strategy is built into the scroll sequence itself. Visitors see the full picture before they are asked to act.

1. The animated hero and typewriter headline create immediate emotional engagement, then present the primary booking call to action while curiosity is highest.
2. The season arc sections show parents the finish line (Championship Circle) before asking them to commit to the starting block, reducing hesitation and building confidence in the program.
3. Two separate conversion paths, the inline scheduler for families and the team registration form for counselors and directors, mean every visitor type finds a clear next step without friction.

Other information about this template

This template is built as a single-column flow landing page, making it straightforward to customize section by section without disrupting the overall layout logic.

• The template is localized for English-language use in the United States, with date formatting in MM/DD/YYYY and pricing in USD
• Animation intensity is high by design: CSS breathing shapes, typewriter text, scroll-triggered reveals, and staggered card entries are all included out of the box
• The page supports a business-to-consumer and business-to-business hybrid model, handling both individual parent bookings and institutional group registrations from a single URL

Show more