webdevpuneet.com

Yoga & Wellness Studio Website Template

A calm, airy website for a yoga, Pilates or meditation studio. A sunlit photo hero invites a free first class, and the weekly timetable lets visitors pick a day and filter by class type, with teachers, levels and spots left on every row. Class style tiles, a studio story, memberships, teachers, reviews, a class reservation form and the studio's hours and location complete the page.

One page keeps everything on a single scrolling page. The 6-page website opens all its pages in the editor: Home, Classes, Memberships, Teachers, Visit, Privacy.

Full page preview · scroll to see it all
The complete Yoga & Wellness Studio Website template: Simple Sticky Navbar, Image Background Hero, Collection Tiles, Class Timetable, Split Features With Image, Gradient CTA Banner, Pricing List Rows, Team Grid, Testimonial Wall, Booking Request Form, Opening Hours & Location, Multi-Column Footer

Yoga & Wellness Studio Website Template — Free, Editable, Export HTML

Health & fitness · One page or 6 pages · 12 sections · Lora + DM Sans · Responsive · GSAP animation

Updated October 20, 2026

Extend with AI

Take This Template Further With AI

Give this prompt to an AI assistant to generate your own version of the Yoga & Wellness Studio Website template: swap in your business name, services and tone, add or remove sections, translate it, or turn the page into a Next.js project or a WordPress theme. Use the template above as the visual reference, so you and the AI start from a design that already works.

Prompt to recreate it

Copy this into your AI assistant of choice to build the effect from scratch, or as a jumping-off point for your own variant:

text
Build a complete yoga & wellness studio website for “Stillwater” as clean HTML, CSS and a little JavaScript.

Page structure, top to bottom:
1. Simple Sticky Navbar
2. Image Background Hero: “Slow down. Breathe.”
3. Collection Tiles: “Find your practice”
4. Class Timetable: “Find your class”
5. Split Features With Image: “A space designed for calm”
6. Gradient CTA Banner: “Your first class is on us”
7. Pricing List Rows: “Choose how you practise”
8. Team Grid: “Guided by people who care”
9. Testimonial Wall: “Loved by our community”
10. Booking Request Form: “Book a class”
11. Opening Hours & Location: “Come and find us”
12. Multi-Column Footer

Look and feel:
- Colours as CSS custom properties: brand #4a6b5a, page background #fbf9f4, cards #eef2ec, text #1f2f27, muted text #586a60. Corner radius 16px, content width 1200px.
- Headings in Lora, body text in DM Sans (load both from Google Fonts with display=swap).
- Mobile first. Sections use CSS grid or flexbox and stack cleanly below 700px.

Content:
- Write real, believable health & fitness copy for every section instead of lorem ipsum: specific offers, numbers, names and calls to action.
- One clear primary action in the hero and again near the end.

Quality:
- Semantic HTML (header, main, section, footer) with exactly one h1, the hero headline, and one h2 per section.
- Accessible: alt text on every image, visible focus states, labelled form fields, buttons and links with clear text, and prefers-reduced-motion respected.
- SEO: title “Stillwater Yoga Studio in Bristol: Classes for All Levels”, a meta description of 150 to 160 characters, Open Graph tags and JSON-LD that suits a health & fitness business.
- Optional: a subtle GSAP ScrollTrigger fade-up on section headings, with content visible without JavaScript.

Also create these pages with the same navbar, footer and theme, and link them from the menu:
- Classes (schedule.html)
- Memberships (pricing.html)
- Teachers (teachers.html)
- Visit (visit.html)
- Privacy (privacy.html)

Want to tighten it up first? Run this prompt through the AI Prompt Studio to score it across 8 quality dimensions, catch anti-patterns, and tune the wording for Claude, ChatGPT, or Gemini before you paste it in.

Multi-page version

Pages in the 6-Page Yoga & Wellness Studio Website Template

Home (index.html): 10 sections, the home page
Classes (schedule.html): 3 sections
Memberships (pricing.html): 2 sections
Teachers (teachers.html): 2 sections
Visit (visit.html): 2 sections
Privacy (privacy.html): 1 sections

What's included

Sections in the Yoga & Wellness Studio Website Template

Simple Sticky Navbar: A clean, responsive site header: logo on the left, navigation links, a log-in link and a call-to-action button
Image Background Hero: A full-width hero with your photo as the background, a dark gradient overlay that keeps text readable, a small label, a large white headline, supporting text, two buttons and an optional row of three stats along the bottom
Collection Tiles: The tile row that sends shoppers into the right part of your shop
Class Timetable: A weekly schedule people can actually use
Split Features With Image: A two-column feature section: an eyebrow, heading and intro above a short list of icon-led features and a button on one side, a framed product screenshot on the other
Gradient CTA Banner: A bold closing call to action: a rounded panel in a rich brand gradient with a subtle grid texture and a soft glow that follows the pointer, a centred heading and text, two buttons that drift toward the cursor, and a short reassurance note underneath
Pricing List Rows: Plans and packages as horizontal rows instead of cards: each row shows the plan name and description, a few highlight chips, the price and a button, with one featured row picked out by a badge
Team Grid: A “meet the team” grid: a centred heading, then cards with each person’s photo, name, role and a one-line bio
Testimonial Wall: A "wall of love" testimonials section: a heading with an overall rating summary, then customer quotes in a masonry layout where cards of different lengths fit together neatly
Booking Request Form: An appointment request section: on the left a heading, opening hours and a short list of what to expect; on the right a form card with name, email, phone, a service menu, a date picker, time slots and a notes box
Opening Hours & Location: A section every local business needs: a weekly opening hours table with today highlighted, a live “Open now” or “Closed, opens Tuesday 09:00” badge that follows the business’s own time zone, the address and an embedded map, and buttons to get directions or call
Multi-Column Footer: The classic website footer: your logo, a one-line description and social icons on the left, up to five columns of links on the right, and a bottom bar with the copyright, legal links and a back-to-top button that scrolls smoothly with GSAP

Checklist

What a yoga & wellness studio Website Needs

A timetable that shows today first and can be filtered by the kind of class people like
Level labels and a clear "beginners welcome" message, so newcomers are not put off
Photos of real classes and the studio itself, with teachers named and described
Simple, honest prices with a free first class and no contract
An easy booking request that says what to wear and bring
Studio hours, the address and how to get there one tap from every page, with a word on bike storage or parking

About this template

A Free Yoga & Wellness Studio Website Template You Can Edit Online

A calm, airy website for a yoga, Pilates or meditation studio. A sunlit photo hero invites a free first class, and the weekly timetable lets visitors pick a day and filter by class type, with teachers, levels and spots left on every row. Class style tiles, a studio story, memberships, teachers, reviews, a class reservation form and the studio's hours and location complete the page.

Use it as one scrolling page, or as a 6-page website (Home, Classes, Memberships, Teachers, Visit, Privacy) sharing one navbar, footer and theme. The one-page version is built from 12 sections of the Website Section Templates library and opens in the free Website Builder, where you can change every word and image, swap sections, set your own colours and fonts and export the finished site as clean HTML pages. The page is responsive, accessible and animated with GSAP, with content that stays visible without JavaScript.

The template ships with a Lora and DM Sans font pairing and a colour theme suited to yoga & wellness studio websites; switch to any Google Font, upload your own, or apply your brand kit in one click.

Extras included

Extras Built Into the Yoga & Wellness Studio Website Template

Beyond the standard sections, the Yoga & Wellness Studio Website template includes 2 extras that you can edit, move or remove in the builder.

Opening Hours & Location: an opening hours section with a live Open now badge.

About Us & Our Story: an About us section with the story, facts and values.

Each extra has its own page in the free Website Section Templates library, where you can try its settings on their own before you use it here.

Make it yours

How to Get the Most From the Yoga & Wellness Studio Website Template

A yoga studio website has one main job: help a nervous newcomer find a class they feel good about and book it. This template is built around that. The home page opens with a sunlit photo hero and a "Book your free class" button, then four class style tiles (vinyasa, Pilates, meditation, restorative), the weekly timetable, a short story about the studio, a first class free banner, memberships, teachers, reviews, a class reservation form and live opening hours with a map.

The Class Timetable is the section made for this template. Day tabs run from Monday to Sunday with today marked and opened first, filter chips are built from your class types, and each class is a row with the time, name, teacher, length, level, spots left and a Book button. You can type the classes in any order, because every day is sorted by time automatically.

On separate pages, the studio's information spreads out: Classes holds the full timetable, the style tiles and a beginners' question list, Memberships shows drop-in, pass and unlimited prices, Teachers tells the story of the studio, and Visit pairs the reservation form with opening hours, a map and directions. The hours show a live "Open now" badge and are written as local business data.

A reservation goes to the form service you pick and reaches the studio by email, and someone replies to confirm the spot. Nothing here counts real places, takes payment or keeps a waiting list; the "spots left" line on each class is text you type. Studios that already run bookings through dedicated software can send every Book button there instead.

The timetable is real HTML text rather than an image, so class names, teachers and times can be read by search engines and screen readers alike, and each page keeps one main heading with described photos.

Who it’s for

Best For

★
Yoga and Pilates studios
A ready-made starting point for yoga and pilates studios, with real copy you can adapt in minutes.
◆
Dance, barre and fitness studios
A ready-made starting point for dance, barre and fitness studios, with real copy you can adapt in minutes.
●
Wellness centres and meditation groups
A ready-made starting point for wellness centres and meditation groups, with real copy you can adapt in minutes.

Step by step

How to Use This Template

  1. 1
    Open the templateClick “Use as one page” or “Use as 6-page website” to load it in the Website Builder. Your current website is kept in Saved.
  2. 2
    Make it yoursClick any section to change its text, images and links; upload your logo and photos.
  3. 3
    Set your brandPick colours and fonts in the Theme tab, or apply your saved brand kit.
  4. 4
    Adjust the pageAdd sections from the library, drag to reorder, duplicate or remove what you don’t need.
  5. 5
    Export and publishDownload the ZIP (one HTML file per page for the multi-page version) and upload it to Netlify, Vercel or any host.

Got questions?

Frequently Asked Questions

A weekly schedule with day tabs, class type filters and a row per class showing the time, teacher, length, level, spots left and a Book button. Each day is sorted by time automatically.

They can send a class reservation request through the form, which goes to a form service you choose. It is not a live booking or payment system, so link the Book buttons to your studio software if you need those.

Yes. Replace the classes, class types, photos and prices, rename the style tiles and keep the timetable, memberships and booking form. It suits any studio with a weekly schedule.

Into five pages: Home, Classes, Memberships, Teachers and Visit. The timetable and the booking form each get a page of their own, and the navigation and footer are shared.

No, they are a worked example. The studio, its Bristol address, the teachers, class times and prices are invented, so replace them with your own and only show spots left when the number is true.

Yes. The Yoga & Wellness Studio Website template is free for personal and commercial use, with no sign-up, no watermark and no attribution required.

Click “Use this template” to open it in the free Website Builder. Click any section to change its text, images and links, change colours and fonts for the whole page in the Theme tab, and add, remove or drag sections to reorder them.

Both. Use it as one scrolling page, or as a 6-page website (Home, Classes, Memberships, Teachers, Visit, Privacy) that opens with every page in the editor. The pages share one navbar, footer and theme, and the menu links to every page automatically. Add more pages (About, Pricing, Contact, Blog and others) or remove any you don’t need in the builder’s Pages tab.

Yes. As one page you get a ZIP with index.html and an assets folder. As a 6-page website you get one HTML file per page (index.html, schedule.html, pricing.html, teachers.html, visit.html, privacy.html), a shared styles.css and script.js, and an assets folder with your images, then upload it to any web host. Links between pages also work when you open the files from your computer.