A sport campaign slider built like a play-by-play - forward-leaning Oswald italic, sport-green and white type on a black field, and cutout athletes bursting through the headlines mid-stride. Six slides walk through a "RUN HARDER" hero, two athlete profile cards with number-roll stats, a "WINS / RECORDS / GOAT" scoreboard slide, a manifesto rest beat, and a green drop CTA closing on a cutout product sneaker. This is the template that most aggressively uses the cutout-through-the-type layering technique - the athlete sits inside the composition, not beside it.
The palette is tight on purpose: jet black #0a0a0a, sport green #22c55e, and pure white. The italic carries the lean of an athlete in motion, the mono carries the stats sheet, and the layering pattern reads as a poster that was actually art-directed instead of generated. Open the template in Swiper Studio, swap in your roster or campaign cast, retype your stats, and ship a sport hero that looks unmistakably built for a pro brand.
Cutout Athletes Bursting Through the Type
The signature WOW move - a giant sport-green italic headline sits behind a cutout sprinter mid-stride, with a small mono campaign label in front. Three layers, one composition. The athlete is inside the type, not beside it, which is the technique that turns a slide from a slider into a hand-built poster.
Forward-Leaning Oswald Italic at Display Scale
Oswald italic at weight 700 carries the entire campaign. The condensed letterforms tilt forward in the direction of motion, so the type reads like it is running with the subject. At 280px on desktop the headline becomes a billboard - no decoration, no gradient, just letterforms with kinetic energy.
Number-Roll Stats Like a Scoreboard
Personal-best times, race counts, and championship totals animate in with number-roll on every slide entry - digits cascade up from zero to the final value as if a scoreboard just locked in. Edit a stat in the text field and the animation re-runs automatically without any extra config.
Athlete Profile Cards With Real Stats Sheet
The Maya Tanaka and Kipchoge Njeri slides combine a full-body cutout, a name in white italic, a sport-green personal best, and a Space Mono stats line covering distance, world rankings, and career highlights. The structure is mirror-able for any sport - swap the labels to KO\'s, lap times, or season points and the layout still reads.
Manifesto Rest Beat Between Visual Slides
Slide 5 drops every image and lets a single white italic line - "PAIN IS A FACT. QUITTING IS A CHOICE." - sit alone on black, attributed to "THE TEAM" in sport green. The pacing matters: the rest beat between scoreboard and product drop is what makes the layering on the surrounding slides land harder.
This template is built for sport brands, sneaker brands, and athletic apparel campaigns that want their lineup, drop, or season story to look as designed as their product. The cutout-through-the-type technique signals craft before a visitor has read a single word, and the six-slide sequence covers the entire campaign arc - manifesto, athlete cast, stats, conviction line, and product reveal.
Running clubs, gyms, and fitness app teams can use the same structure for a launch, a class roster, or a season campaign. Swap the sprinter and marathoner for your head coach, your top class instructor, or your community ambassador, and the scoreboard stats become member counts, class minutes, or PR records.
Esports teams and competitive sports organizations get a poster-grade roster reveal that finally treats players with the same gravitas as track-and-field athletes. The number-roll stats slide handles K/D ratios, season wins, or trophy counts as cleanly as 100m times, and the manifesto slide turns into a team mantra reveal.
- ✓Sneaker brand and athletic apparel SS or FW campaign launches
- ✓Running club season announcements with featured athletes and PR stat sheets
- ✓Esports team roster reveals with player profiles and match record scoreboards
- ✓Gym and fitness studio brand pages featuring head coaches and community PRs
- ✓Fitness app launch heroes promoting a flagship trainer and program stats
- ✓Athlete personal sites combining a campaign hero with a stats and sponsor sheet
- ✓Pro league season-opening campaigns and team announcement microsites
- ✓Sportswear product drop landing pages tied to an athlete campaign reveal
- Open the Athletic Italic template in Swiper Studio - you will see six slides: the "RUN HARDER" hero, two athlete profile cards, a scoreboard slide, a manifesto rest beat, and a sneaker drop CTA.
- Retype the hero headline - replace "RUN HARDER" with your own two-word campaign line and keep the sport-green color so the cutout sprinter still reads against the type.
- Swap the cutout athletes - upload your own transparent PNGs for the sprinter, marathoner, and product shot, or run regular photos through Swiper Studio's AI background removal for clean isolated subjects.
- Edit the athlete profile cards - retype the names (Maya Tanaka, Kipchoge Njeri) and update the sport-green personal best plus the Space Mono stats line covering distance, ranking, and career highlights.
- Update the scoreboard slide - change the 26 / 4 / 1 wins, records, and GOAT numbers to your own metrics, and the number-roll animation will re-run with the new values.
- Rewrite the manifesto rest beat - swap "PAIN IS A FACT. QUITTING IS A CHOICE." for your team mantra and update the "THE TEAM" attribution to your brand or roster.
- Retarget the drop CTA - change the "04.20.26 / NEW LINE DROPS" date, swap the cutout sneaker for your product, and point the "SHOP THE DROP" link to your storefront.
- Tune the responsive breakpoints so the 280px italic headline scales cleanly to phone, then publish to CDN or export to React, Vue, HTML, or Webflow.
- Can I swap the athletes for my real roster or campaign cast?
- Yes. Every athlete cutout, name, and stat line is fully editable in Swiper Studio. Upload a transparent PNG of your sprinter, marathon runner, or campaign model and the layered "cutout-through-the-type" composition holds together. If your source photo has a background, run it through Swiper Studio's AI background removal to get a clean isolated subject.
- How do the number-roll stat animations work?
- The personal-best times, race counts, and championship totals use Swiper Studio's number-roll entry animation - the digits cascade up from zero to the final value when the slide enters view. Select any stat element to swap the value, and the animation re-runs on every slide change without any extra setup.
- Which fonts does this template use and can I change them?
- The campaign pairs Oswald italic at weight 700 for the headlines and athlete names with Space Mono for the scoreboard stats, race distances, and small campaign labels. Both load automatically from Google Fonts. Swap either typeface in the style panel if you prefer a different display italic, but keep one condensed italic plus one mono to preserve the play-by-play feel.
- Does the 280px headline type stay readable on mobile?
- Yes. The template registers responsive breakpoints at 375px, 768px, and 1024px, so the "RUN HARDER" italic headline scales from around 280px on desktop down to 80-100px on phone without breaking the cutout layering. Each breakpoint exposes its own font size, line height, and gap controls in the responsive panel.
- Can I retarget the final drop slide to my own product or signup?
- Yes. The closing slide ships with a sport-green field, a black "04.20.26 / NEW LINE DROPS" headline, a cutout sneaker, and a "SHOP THE DROP" link block. Update the date, swap the sneaker for your own product cutout, retarget the link to your storefront, newsletter, or training plan signup, and the green field handles any product silhouette.
Ready to Build Your Slider?
Pick a template, customize it visually, and export production-ready code to React, Vue, Next.js, HTML, Webflow, and more. No coding required.