Junk Removal Website Template
Demo brand: HAULSTEAD CLEARANCE & HAULAGE · Junk removal & house clearance · 16 routes · Astro 7 + Tailwind 4
Live preview
The demo is a full desktop site. Open it in a new tab ↗
About this junk removal website template
A complete lead-generating site for a clearance and haulage firm: sixteen built routes including five service pages, load prices by fraction, a what-we-don’t-take page, a where-it-goes page, a booking route and a two-post journal.
Weathered load-sheet khaki — the canvas a hauled load travels under — with a single hi-vis accent reserved for the price, the CTA and the fraction latch. Six rendered colours, no seventh. Oswald against Golos Text.
The signature move is the sort line. One persistent drawn truck-bed cross-section rides the whole document on the trade’s own fraction scale, 1/8 through to FULL. Each section is a room of one clearance job, whose items stand inline among the copy and board the bed as the section crosses the reading line. By the end of the page you have watched a house empty into a truck, and you have learned what an eighth of a load looks like — which is the thing every customer gets wrong when they phone.
The 16 pages you get
- Home
/ - The truck bed filling, the positioning, the load prices and the booking close.
- What we clear
/services/ - The index — by job type, which is how people describe what they need gone.
- Five service pages
/services/… - House clearance, garage & loft, garden waste, appliances, office strip-out. Each a full route, each its own search.
- Load prices
/prices/ - Priced by fraction of a load — the trade’s own unit, published. This is the page that stops the phone call starting with "how much?".
- What we don’t take
/what-we-dont-take/ - Refusals, stated. It saves a wasted visit and it reads as competence rather than as a limitation.
- Where the load goes
/where-it-goes/ - Disposal and recycling routes. Increasingly the question that wins the job.
- Book a collection
/book/ - A working form plus live tel: and mailto: paths.
- Journal
/journal/ - A wired content collection — add an .mdx file and it appears here and in the sitemap.
- Two worked articles
/journal/… - What an eighth of a load actually looks like, and why we take the legs off before it goes on the truck.
- Privacy & terms
/privacy/ - A real legal route covering both.
- 404
/404 - Designed, not default. Keeps the navigation.
What is in the build
- A persistent drawn truck-bed cross-section riding the whole document on the trade’s own 1/8-to-FULL fraction scale
- Items that stand inline in the copy and board the bed as their section crosses the reading line — the page fills the truck as you read it
- Load pricing published by fraction, which is the unit the trade quotes in and the thing customers most consistently misjudge
- A what-we-don’t-take route and a where-it-goes route — refusals and disposal, the two pages that prevent wasted visits and win environmentally-minded jobs
- Six rendered colours with one hi-vis accent held for price, CTA and the fraction latch
- Oswald with Golos Text, both self-hosted; a working booking form plus live tel: and mailto:
- Vitest and Playwright suites included in the repository
The design decision
Every template in this catalog is loud in exactly one channel and deliberately quiet in the other three. That single rule is what stops 62 different worlds reading as one design system in different paint.
- The world
- Weathered load-sheet khaki — the canvas a hauled load travels under — with a single hi-vis accent reserved for the price, the CTA and the fraction latch. Six rendered colours, no seventh.
- The mechanic
- "The Sort Line": one persistent drawn truck-bed cross-section rides the whole document on the trade's own fraction scale (1/8 → FULL). Each section is a room of one clearance job whose items stand inline among the copy and board the bed as the section crosses the reading line.
- Loud channel
- Moving set-piece
- Imagery. Truck bed fills by eighths
- Type & palette
- Oswald · Golos Text
-
#74582e#f7f4ea#dcee3c
Who it is for
Built for junk removal, house clearance and light haulage firms — and the agencies that build lead-generation sites for trades. It suits an operator who prices by load fraction and wants customers to arrive already understanding the unit. The dumpster-rental, moving and cleaning builds are the neighbouring trades.
Under the hood
- Astro 7 · static output, zero client framework
- Tailwind 4 · one @theme block holds the palette
- MDX content collections for the blog
- GSAP + Lenis for the scroll work, reduced-motion aware
- Self-hosted woff2 — no Google Fonts request
- Sitemap, canonicals and per-route meta wired
- Vitest + Playwright suites in the repository
- Zero third-party requests · strict CSP-ready
How to get started
- 01 Accept the repository invite and clone it.
- 02 Run
npm install, thennpm run dev. - 03 Replace the content in
src/data/with your own — that is where the brand, the copy and every list live. - 04 Swap the images in
public/images/and the palette in the@themeblock. - 05 Run
npm run buildand deploydist/anywhere static.
Questions
Is pricing by load fraction worth explaining on the site?
It is the single biggest source of friction in this trade — customers think a sofa is half a load. The set-piece fills a bed by eighths as you read and an article does the rest, which turns the quote call into a confirmation rather than a negotiation.
Why a page about what you will not take?
Because a wasted visit costs you a morning. Stating the refusals — asbestos, certain chemicals, whatever your licence excludes — reads as licensed competence and filters the jobs you cannot do.
Can I use it for skip hire?
The structure fits, but the dumpster-rental build is the one made for skip and roll-off hire, with gate rates per tonne and a contamination model. This one is for man-and-truck clearance where you do the loading.
What exactly do I get for $49?
Access to a private GitHub repository holding the complete Astro source of this template — every route you see in the preview, the content model, the images and the tests. Updates arrive in that same repository.
How many sites can I build with one licence?
As many as you like, for yourself or for clients. The licence is per buyer, not per project. The one thing you may not do is resell or redistribute the source as a template, theme or starter kit.
Do I need to know Astro?
It helps, but the common case is editing content and colour. Content lives in typed objects under src/data, colour lives in one @theme block, and npm run dev shows the result. Deploying is a static folder — Cloudflare Pages, Netlify and Vercel all take it as-is.
Is anything loaded from a third party?
No. Fonts are self-hosted woff2, there is no analytics, no tag manager, no CDN script and no external CSS. The build ships static HTML under a strict Content-Security-Policy.
More trades & industry templates
KELMER OVERHEAD DOOR
Garage door repair
Loud
Moving set-piece
TORWICK LOCK & SAFE
Locksmith / master keying
Loud
Moving set-piece
KANWICK STEELWORKS
Steel fabrication
Loud
Texture
Crowder Plumbing & Drainage
Plumbing & drainage
Loud
Moving set-piece
BRISKWELL CLEANING CO.
Contract cleaning
Loud
Palette