Lawn Care Website Template

About this lawn care website template

The 26 pages you get

Home /

Split hero with a featured-project chip, four promises, eight service cards, the company story on a dark moss band, recent projects with costs, the build process, the garden cost estimator, the maintenance plan table, reviews with what was built, a month-by-month jobs strip, guides, FAQ with a "when to book" card and a lawn-care call to action.

Services /services/

All eight services with a price-from, what it buys and time on site.

Service pages /services/…/

Eight services, from garden design to lawn-care plans. Photo, price, what is included, how the work is done, service FAQs, matching projects and a quote button that pre-selects the service.

Projects /projects/

Four finished gardens with area, weeks on site and final cost, plus totals at the top.

Project pages /projects/…/

Four projects. Large photo, a fact row (area, weeks, cost), the brief and the build, a "what we built" list, the services used, a client quote and a gallery.

Prices and plans /pricing/

A starting-price table for every service, the garden cost estimator, the lawn-care plan picker and the maintenance plan comparison.

About /about/

Why the firm uses its own crews, the team as initials (no face photos), the build process and reviews.

Journal /journal/

A lead guide, the other guides and the month-by-month jobs strip. Add an .mdx file and it appears here.

Articles /journal/…/

Three written guides: what a patio costs per square metre, winter garden jobs, and planting a border that looks good in year one.

FAQ /faq/

Questions grouped into costs and booking, lawns, and payment, with the "when to book" card beside them.

Book a garden visit /contact/

Contact details, opening hours and a booking form that fills in the service, budget and estimate from any button or widget that links to it.

Privacy and terms /legal/…/

Two starter pages on a shared layout, written for a landscaping business (quotes, deposits, weather, guarantee).

404 /404

Designed, with links back home and to the services.

What is in the build

• A garden cost estimator: garden size, patio, new lawn, planting beds, fencing, lighting and pergola give a price range, weeks on site, the best season to start and a line-by-line breakdown
• A lawn-care plan picker: lawn size and 4, 6 or 8 visits a year give the price per visit, per month and per year
• Every rate in one pricing file, so the estimator, picker, plan table and prices page change together
• Maintenance plans compared (fortnightly, monthly, seasonal), stacking row by row on phones instead of scrolling sideways
• Services and projects as content: price-from, time on site, area, weeks and budget in one Markdown file each
• A month-by-month seasonal jobs strip that opens on the current month
• Booking buttons that pre-fill the contact form with the service, budget and the visitor's estimate
• 27 real garden photographs, optimised to WebP by Astro, with sources listed in LICENSING.md
• All business details in one file, and one accent colour that rebrands the whole site
• Vitest and Playwright suites included

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 65 different worlds reading as one design system in different paint.

The world

White pages with warm linen blocks and one dark moss band, Brygada 1918 headings over Lato, real photographs of finished gardens, patios, borders and lawns, and one moss-green accent.

The mechanic

A garden cost estimator turns garden size and elements (patio, lawn, beds, fencing, lighting, pergola) into a price range, weeks on site and best season to start, and a lawn-care picker prices plans by lawn size and visits; both pre-fill the garden-visit form. Motion is one quiet reveal.

Loud channel

Imagery

Imagery. Finished gardens, patios, lawns, hands in soil

Type & palette

Brygada 1918 · Lato

#ffffff #1b2016 #4d7c0f

Who it is for

Built for landscapers, garden design-and-build firms, patio and paving installers, and lawn-care or garden maintenance companies. It also fits fencing contractors, tree surgeons and garden-lighting installers who sell by the job and want to show prices. It suits a business that wins work through a site visit and a written quote, and wants repeat income from maintenance plans.

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

1. 01 Accept the repository invite and clone it.
2. 02 Run npm install, then npm run dev.
3. 03 Replace the content in src/data/ with your own — that is where the brand, the copy and every list live.
4. 04 Swap the images in public/images/ and the palette in the @theme block.
5. 05 Run npm run build and deploy dist/ anywhere static.

Questions