Fitness Programs Template
Every class and plan.A programs page: a photographic hero, a training process, a feature relay, a class gallery, à-la-carte pricing and an FAQ before the split CTA — styled by your tokens.
When to use this template
A programs page has to make a schedule comprehensible: what runs, how often, and who each one is for.
Fitness Programs is for a gym, studio or coach that sells several distinct programmes — strength, beginners, small-group, personal training — and needs one page that tells them apart. It opens on a full-bleed Canvas photograph, then uses Blocks to show how someone gets started (trial, assessment, plan) and Relay to lay out how a programme progresses. Showcase gives each programme its own photo card, and Carte lists prices as a menu of rows rather than plan cards, which suits drop-in rates and session packs.
The Clarity FAQ answers the beginner questions: fitness level, what to bring, how to cancel. Use Fitness Membership instead when you sell one monthly plan, and Fitness Classes when the timetable matters more than the programmes. Tip: use one photo per programme showing real members, not stock imagery.
At a glance
- Page type
- Programs
- Business
- Fitness
- Sections
- 9
- Section types
- 9
- Design tokens
- Colour, Radius, Shadow, Spacing, Typography
- Requires JS
- No
- Price
- Free
9 sections in this page
Every section below is a real, responsive layout rendered in your own design tokens — not a screenshot. In page order:
-
1
Tier
NavbarThe nav links sit inside a rounded segmented pill in the centre, the active link filled as its own segment.
-
2
Canvas
HeroThe picture is the section: a full-bleed photograph fills the hero with the headline and buttons resting near the bottom.
-
3
Blocks
ProcessA grid of numbered step cards, each leading with a large index number above its title and text.
-
4
Relay
FeaturesA four-step sequence rather than parallel cells, each step a numbered icon node on a connecting track.
-
5
Showcase
GalleryA three-column grid of image cards, each a swappable photo slot over a title and caption.
-
6
Carte
PricingA menu-style price list rather than a card grid — a narrow, hairline-divided run of rows, at home on a service business.
-
7
Clarity
FAQA single-column accordion using native expand and collapse — real open/close behaviour with no scripting.
-
8
Split
Call to actionA horizontal call to action — heading and subcopy on the left, a solid and a ghost button on the right.
-
9
Anchor
FooterA minimal centered footer — a wordmark, one wrapping nav row, a divider, then copyright and social buttons.
Fitness Programs template FAQ
Common questions about Fitness Programs — how it compares with Fitness Home, which of its 9 sections you can drop and where the sample copy in the preview comes from.