Personal Trainer Profile Professional Website Template

Repcard is a bento grid landing page built as a digital business card for personal trainers. It combines a Before/After Slider header, cinematic scroll-driven cell animations, and multiple conversion paths into one dark, immersive page. Independent coaches, gym floor trainers, and boutique studio owners can share one link instead of handing out paper cards.

by Rocket studio

Quick summary

Repcard is a single-page digital business card for personal trainers. It uses a bento grid layout to present transformation results, session details, and booking options in one shareable link. The dark, cinematic design feels intentional and credible, the kind of page a serious trainer sends, not a generic bio template.

Who this template is for

This template is built for fitness professionals who need a polished, shareable page that does the work of a business card, a portfolio, and a booking link at once.

  • Independent personal trainers working gym floors or outdoor circuits
  • Online coaches building client rosters through social media
  • Boutique studio owners who want one link to share instead of a printed card

What problem this template solves

Most trainers rely on a DM, a crumpled card, or a plain link-in-bio that does nothing to prove their value. By the time a potential client gets home, the moment has passed. This template captures that moment.

  • No compelling proof of results when a lead first lands on your page
  • No clear path from "interested" to "booked" in a single scroll
  • No visual identity that matches the discipline of serious training

What you get with this template

The template delivers a complete, ready-to-customize bento grid landing page. Every cell serves a specific purpose, from showing transformation results to guiding visitors toward a booking.

  • A Before/After Slider header cell with a draggable vertical bar
  • A cinematic scroll sequence of bento cells building intensity as the visitor scrolls deeper
  • Three conversion paths: a vCard save, a free program download, and a calendar booking cell

Feature list

This template is built around one idea: every cell earns trust before asking for anything. The features below reflect exactly what the prompt describes.

Before/After Slider Header

The top bento cell fills with two photographs of the same person, same lighting, same backdrop, separated by a draggable vertical bar. Visitors control the reveal themselves, which makes the transformation feel real and personal rather than staged.

Cinematic Scroll Sequence

Each bento cell loads in sequence as the visitor scrolls, treating the page like frames in a single training day. The rhythm accelerates toward the middle of the page and deliberately slows at the final row, ending with one wide cell and one clear action.

Persistent Bottom Bar call to action

A bottom bar appears after the first scroll and stays visible throughout the session. Its primary call to action, "Save My Card," triggers a vCard download or contact save prompt so the trainer's details live directly in the visitor's phone.

Gated Free Program Cell

One bento cell offers a free four-week training program behind a simple name and email field. This gives visitors a reason to engage before they are ready to book, and gives the trainer a way to start a conversation.

A dedicated cell labeled "Watch Full Transformations" opens a lightbox gallery of client results. The gallery lets the trainer's track record speak without interrupting the scroll flow of the rest of the page.

Direct Booking Cell

A standalone bento cell connects to a calendar embed for session booking. Visitors can move from browsing to scheduled without leaving the page or sending a message.

Page sections overview

SectionPurpose
Before/After SliderOpens with a draggable transformation reveal that anchors credibility immediately
Trainer Name LockupDisplays name and credential in condensed uppercase parchment type
Cinematic Grid SequenceScroll-driven cells show hands on a barbell, a program spreadsheet, a kettlebell loop, and a testimonial
Free Program CellCaptures name and email in exchange for a downloadable four-week training plan
Book a SessionEmbeds a calendar link so visitors can schedule directly from the page
Transformation GalleryOpens a lightbox with full client transformation photography
Persistent Save BarStays fixed at the bottom after first scroll with the primary "Save My Card" action

Design & branding system

The visual identity follows a Dark Immersive theme built on an Ink and Paper color system. Every color choice reinforces the atmosphere of early-morning training: focused, spare, and earned.

  • Deep blackout (#0B0B0F) as the primary canvas, charcoal graphite (#1E1E24) for grid cell backgrounds, and worn parchment (#E8E0D4) for typography and card surfaces
  • A single red chalk accent (#C43A2C) reserved strictly for calls to action and active states
  • Condensed uppercase typography set in parchment, giving the trainer name and credentials a bold, no-frills presence

Mobile & speed optimization

The bento grid layout is designed to translate naturally to smaller screens, where most visitors will open a shared link from a text message or social media profile.

  • Grid cells restack vertically on mobile so the scroll sequence and cinematic rhythm remain intact
  • The persistent bottom bar stays anchored at the bottom of the viewport on all screen sizes, keeping the primary action always reachable
  • Media-heavy cells, including the Before/After Slider and the looping kettlebell video, are structured so they do not block the initial render of the page

How this template helps you convert

The page is structured so that every scroll builds trust before asking for a commitment. Conversion is layered, not forced.

  1. The Before/After Slider at the top proves results before any text makes a claim, removing skepticism early in the visit.
  2. The cinematic grid sequence creates momentum and context, a close-up of a barbell grip, a programmed spreadsheet, a live movement clip, and a real testimonial all combine to show method and credibility.
  3. Three distinct conversion paths, save contact, download a free program, book a session, meet visitors at different levels of readiness so no lead is lost because the timing was not right.

Other information about this template

This template is categorized under Personal and Resume, specifically in the Personal Trainer Profile subcategory. It is designed to serve the personal trainer digital business card niche, where the goal is one shareable link that replaces multiple scattered touchpoints.

  • The template style is Bento Grid, and the creative direction is Cinematic Sequence, meaning visual storytelling drives the layout rather than static content blocks
  • The header concept is the Before/After Slider, which is the centerpiece of the page and the first thing any visitor sees
  • The landing page direction is Content and Resource, prioritizing proof and value delivery before conversion asks
Personal Trainer Profile Professional Website Template
Personal Trainer Profile Professional Website Template
Personal Trainer Profile Professional Website Template
Personal Trainer Profile Professional Website Template

Theme

Dark Immersive

Creative direction

Cinematic Sequence

Color system

Ink & Paper

Style

Bento Grid

Direction

Content/Resource

Page Sections

Before/after Slider Header

Cinematic Scroll Sequence

Persistent Bottom Bar Call to Action

Gated Program Download Cell

Direct Calendar Booking Cell

Lightbox Transformation Gallery

Related questions

Can I use this template without a physical gym or studio?

What does the Save My Card button actually do?

How does the free program download work?

Can I replace the placeholder photos and trainer name with my own?

Is this template suitable for sharing through a text message or social media bio?