Gridline is a full-width immersive landing page template built for classic car racing preparation workshops. It uses a dark pit-garage aesthetic, a midnight blue colour system, and a series of interactive before/after sliders to carry visitors from barn-find to race-trim. The design is engineered to earn consultation bookings through cumulative visual proof, not persuasion copy alone.
by Rocket studio
Gridline is a single-page, click-through landing page template designed for bespoke classic car racing preparation services. It opens with a full-viewport before/after drag slider and unfolds through five scroll-driven sections. Every element is built around one goal: convincing a collector or gentleman driver to book a consultation before the page ends.
This template is built for workshops and specialists operating at the premium end of historic motorsport preparation. It speaks directly to clients who value authenticity, precision, and competitive results over volume or speed.
Most workshop websites list services and show a gallery. That approach fails the client who needs to feel the transformation before they commit a six-figure restoration. Gridline replaces passive browsing with an active, evidence-led experience.
Gridline delivers a fully structured, design-ready landing page with five distinct content sections and a linear single-row footer. Every component is included and positioned for immediate customisation.




Theme
Dark Immersive
Creative direction
Before/After Reveal
Color system
Midnight Blue
Style
Full-Width Immersive
Direction
Click-Through
Page Sections
Full-viewport Before/after Hero Slider
Scroll-linked Section Reveals
Sticky Click-through Call to Action
Grid Finale and Social Proof Link
Dark Pit-garage Visual System
Five-section Scroll Architecture
Does this template include a contact form?
Can I replace the before/after photography with my own workshop images?
How many before/after sliders does the template include?
Is this template suitable for a single-marque specialist workshop?
Does the sticky call-to-action button stay visible throughout the page?
The header fills the entire screen with a draggable before/after slider. The left side shows a barn-find in its discovered state; the right shows the identical car in full race trim. Dragging the slider handle triggers a tagline fade-in: "From forgotten to first in class." No headline appears until the visitor interacts, making the first moment of engagement entirely visual.
Each of the five body sections is triggered by scroll position. Panels float apart in an exploded-view animation for the bodywork section. Macro before/after sliders appear on the engine block, gearbox, and differential in the drivetrain section. The cockpit section contrasts bare aluminium against finished trim. The lighting narrows and the photography tightens as the visitor scrolls deeper, creating a sense of moving physically inside the car.
The primary call-to-action button, labelled "Bring Your Car to the Grid," anchors to the bottom of the viewport after the hero interaction. It recurs at the close of each before/after section. The button uses the single hot accent colour, ignition orange, reserved exclusively for this element and rev counter details across the template.
The final section pulls back to a wide shot of the finished car on a starting grid, surrounded by rivals with heat haze rising from the bonnet. A secondary text link, "View Race Results," sits beneath this photograph for visitors who need factual evidence before emotional commitment.
The colour system uses deep pit-lane black, midnight blue, brushed aluminium silver, and ignition orange as a single accent. Fraunces, a serif display typeface, pairs with DM Sans for body copy. The result reads like a Le Mans sky at the twenty-second hour: everything recedes into shadow except the element directly under the light.
The page moves through bodywork, drivetrain, cockpit, and grid sections in a deliberate sequence. Each section deepens the visual intimacy with the build. By the time the visitor reaches the grid photograph, five slider interactions have replaced any remaining doubt about workshop capability.
| Section | Purpose |
|---|---|
| Hero drag slider | Introduces barn-find to race-trim transformation and triggers tagline fade |
| Bodywork reveal | Floating exploded panel view with before/after sliders on body panels |
| Drivetrain detail | Macro before/after sliders on engine block, gearbox, and differential |
| Cockpit contrast | Bare aluminium versus finished interior trim reveal |
| Grid finale | Finished car on starting grid with primary call to action and social proof link |
| Linear footer | Single-row footer with essential workshop navigation links |
The visual identity is built around a dark immersive theme that treats shadow as the primary design material. Colour is used sparingly, so that every lit element carries full weight.
Gridline is desktop-first by design. The slider interactions, scroll-linked reveals, and staggered panel animations are built for the wide-screen experience that high-net-worth clients use when researching a significant investment.
Gridline is a click-through landing page. There is no form on this page. Conversion is earned through the accumulated weight of transformation proof, section by section, slider by slider.
Gridline is structured as a single-page landing page with a click-through direction, routing all conversions to a separate consultation intake page rather than capturing leads on-page. This keeps the experience clean, immersive, and free of form friction.