Alder & Stone Landscaping style guide

One system, every page.

Every colour, size and component on this page comes from Automatic.css settings and the kit's component classes. Change a setting and the whole kit follows. This page ships with the kit so your client can see the system too.

01

Colour

Primary is the one brand colour and it sits on interactive things only: buttons, links, eyebrows, icons. Accent honey is for star ratings and small highlights. Everything else is ink and stone.

Paper

Heading on ultra-light

Body text and a button take their colours from the band, not from the component.

Get a free estimate
Light

Heading on light

Body text and a button take their colours from the band, not from the component.

Get a free estimate
Dark

Heading on dark

Body text and a button take their colours from the band, not from the component.

Get a free estimate
Ultra dark

Heading on ultra-dark

Body text and a button take their colours from the band, not from the component.

Get a free estimate
02

Type

Yards built to be lived in.

Patios, planting and lawns that last.

What is included

Card title and small headings

Lead text sits under a headline and says the one thing the section is about, in a sentence or two.

Body text is Figtree at 18px on desktop and 17px on phones, line height 1.55, for reading at arm's length. Headings are Bricolage Grotesque at weight 600 with tight tracking. Inline links look like this link to the services page, underlined so nobody has to guess.

Small text for captions, notes under buttons and legal lines. Never lighter than this.

Eyebrow label, the literal section heading
03

Buttons

Three weights: primary for the one ask on a page, outline for the alternative, text link for everything else. Verb plus noun labels. At least 48px tall. Hover lifts nothing here, it darkens; the pressed and focus states are in ACSS.

04

Section intro

Every section starts with this component: the literal heading as an eyebrow, the headline as a paragraph, an optional lead and buttons. Alignment and the band colour are props.

Our services

Everything a yard needs, from one crew.

Design, build and maintenance from the same people, so nothing gets lost between trades.

Recent work

Proof beats promises.

A few of the yards we finished this season.

05

Cards

Service cards

Review cards

Process cards

  1. Walk the yard

    A 30-minute visit to measure, listen and talk budget.

  2. Design and quote

    A drawing and a line-item price within a week. No surprises later.

  3. Build

    One crew, one lead, a schedule you can hold us to.

  4. Walk-through and care

    We walk it with you, fix anything you spot, and hand you a care plan.

06

Talking points and stats

07

Contact details and FAQ

How soon can you start?

Most projects start four to six weeks after you approve the quote. Spring fills up first, so book design visits in winter.

Do you charge for the estimate?

The first visit and quote are free. Full landscape design drawings are a paid service, credited back when you build with us.

Is my yard too small?

No. Half of our work is patios and planting under 1,500 square feet.

08

Media

Images are always in a figure. Cards fix the ratio (4:3), heroes use 3:2, gallery tiles are square. Corners come from the ACSS auto radius, so the client cannot upload a square-cornered photo by mistake.

Backyard patio at golden hour
A finished backyard in Holladay: paver patio, fire pit and native planting.

Free estimate

Ready to plan your yard?

Tell us about the project. We walk it with you within a week and send a drawing and a line-item price.