Roofing Contractor Landing Page
Built for Ashby, the sample brand inside the template
A roofing contractor's site where one house loses its worn roof and gets a new tiled one, stage by stage, as you scroll.
It builds, or it's free. If this prompt doesn't rebuild the site you saw in its live demo, email us within 14 days of buying for a full refund. · Want it for your own roofing?
What to charge$1,800–3,500 for the site as it is, with their name, photos, copy and the form wired to their emailTypical freelance range for Roofing contractors, re-roofing and roof-restoration companies, and small remodel/renovation builders who also do lofts and extensions. The best fits are crews that work on older homes and have photos of their jobs. Not a promise of income · Selling to roofers
How it moves
One locked camera across the street from a white Spanish-style bungalow, shot in soft, bright overcast light like an architect's listing photo, the big hipped roof filling the top of the frame. Scrolling walks the roof from worn and mossy through the tear-off, a new plywood deck and the charcoal underlayment, then scrubs a real time-lapse film of new terracotta tiles going on course by course, and ends on the same house lit at dusk; a hairline ruler names each stage. Then, in the format of a premium building-design studio on warm paper and one brown block: a statement whose tall photo slides across the screen, a giant wordmark rising from the brown block, a works index whose rows slide past a centre line while the middle photo swaps, an approach section with a drifting loft photo, client words between two parting photos, and the close: the new roofline at dusk with the wordmark in the sky and a frosted inspection form. All copy, image slots and prompts sit in one content file, the palette and font in one theme file.
What you get
- A tested build prompt · 13.7k wordsPaste it into Claude Code, Cursor, Codex or Lovable and it builds the landing page section by section.
- The working projectVite + React.
npm install && npm run devand it runs, no keys or accounts. - The assets and their promptsEvery image and loop, plus the exact prompts that made them, so you can make your own.
Sell this site
- Who buys it
- Roofing contractors, re-roofing and roof-restoration companies, and small remodel/renovation builders who also do lofts and extensions. The best fits are crews that work on older homes and have photos of their jobs
- What to charge
- $1,800–3,500 for the site as it is, with their name, photos, copy and the form wired to their email
- Find them on Google Maps
- ••••••••••••••••••••••••••••••••••••••••
- The 30-second call pitch
- “Hi, I build websites for … I looked you up on Maps … Can I send you a two-minute video of it?”
- What the client supplies
- Photos, prices, hours, logo, and which slot each one replaces.
- The upsell
- The second thing to sell them after launch.
Inside the prompt
A one-page site for a roofing and remodel contractor whose hero re-roofs a house while you scroll. One locked camera looks across the street at one white 1930s Spanish-style bungalow in soft, bright overcast light, photographed like an architect's listing photo, the big hipped roof filling the upper half of the frame. At the top the roof is old and worn out: faded concrete tiles, moss, cracked and slipped tiles, dented grey gutters. As you scroll, each stage crossfades in from the same camera: the tear-off (bare battens, a skip of broken tiles on the street), a new plywood deck, the charcoal underlayment with new battens and copper gutters, and then a real time-lapse film, scrubbed by the scroll, lays the new terracotta barrel tiles course by course up to the ridge. The last stage is the same house at dusk, every window lit warm. A hairline ruler at the foot names the stages (Worn, Tear-off, Deck, Underlayment, New tile, Lights on) and a white bar fills along it; clicking a stage scrolls to it. Over the photographs there is only one plain headline, one sentence and one button on the first screen, then one short caption above the ruler at each stage.
- What it is
- Style collection
- Build steps
- Assets
- Motion
- Make it yours
- Launch checklist (after step 7 above)
- Acceptance checks
