Brand guidelines
41 pages
The home is built the way it was drawn, down to the stone.
You see the budget, the schedule and every change in writing.
No noise, no rush, no sales talk. The work speaks.
Talk like a calm builder who has done this many times. Short, plain and sure.
Your budget is set before we break ground. You see every dollar after that.
Who buys, what bugs them, and what to say first. Every quote is a real review.
They bought the land, have a dream for it, and are afraid of the build itself.
A builder who keeps the price, keeps the date and keeps them told.
The budget growing, the build running late, and the builder going quiet.
When it came to change orders, we ended up double over what the estimates were the builder gave us.
What real people wrote, word for word. None of it was written for an ad.
When it came to change orders, we ended up double over what the estimates were the builder gave us.
He springs on us that we are a full 20% over budget for completion, whereas the last meeting we were at about 10%.
Our direct communication with him dropped off about two months in, every budget review meeting has been initiated by us.
He also poured a 6k patio with zero communication, this was not on the plans.
…you probably don't want this huge beautiful shell with cheap looking wood or tile.
You simply cannot get a high quality finish on the usual builder site built.
Open every ad on their problem. Test 5 to 8, and change only the first line.
All 34 hooks, with the quotes they came from, are in MESSAGES.md in the kit.
One fixed budget, one schedule with dates, one person who always answers.
The logo must look the same everywhere. These pages show every version and when to use each one.
Full color on dark backgrounds. On light backgrounds the full color logo fades, so use the one color, dark version.
Pick the version that is easiest to see on what is behind it.
Leave empty space around the logo. Nothing goes in it: no text, no edges, no other logos.
xxxx
x is one third of the logo's height. Keep at least x empty on all four sides.
230px wide on screens
1.8 in wide in print
Any smaller and the details blur. Use the icon instead.
Use the version named under each background.
Each of these makes the logo look cheap or fake. Use the files as they are.
NEW! SALE TODAY
The brand color comes from the logo. The grays and alert colors are built to match. Use them in the amounts shown.
HEX and RGB are for screens. CMYK is a starting point for print: ask your printer to match the HEX and send a proof.
Lighter and darker steps for backgrounds, borders and hover states. The outlined step is the brand color itself.
Mostly calm background, a strong share of Brass, and Basalt for text.
#336941 · Done, saved, in stock
#C69D63 · Check this, running low
#A35F56 · Failed, sold out, delete
#437AA6 · Tips and notices
Use these pairs for words. "No text" means never put words there.
Two typefaces, used the same way every time. Both are free, and the font files are in the fonts folder.
For headlines and big moments. Free on Fontshare.
A high-contrast serif like the capitals in the logo, calm at large sizes.
For paragraphs, buttons and everything else. Free on Fontshare.
Mountain modern homes in stone, timber and glass, across Idaho.
A plain, open sans that stays easy to read on a dark page.
Pixels for screens, points for print. The top size is drawn smaller here to fit.
How the two fonts work together on a page.
Mountain modern homes in stone, timber and glass, across Idaho.
Body text stays at 16px or larger on screens. Keep lines short enough to read in one glance. Links use Brass 600.
Book a ViewingSpacing, grids and shapes make separate pieces look like they came from one brand.
Every gap and padding is a number from this list. Every step is a multiple of 4px, so things line up.
Where things sit on a web page and on a social post.
The logo is a thin square frame with square corners, so corners stay square.
1.5px lines with square ends. Use one icon set with the same line weight everywhere.
The system put to work: buttons, a business card, social posts and a website.
The same shapes and colors on every screen.
Mountain modern homes in stone, timber and glass, across Idaho.
How we build →3.5 × 2 inches. The logo alone on the front, the details on the back.
Pick one and use it everywhere. Each file is 1080 × 1080 and fits inside every circle.
Keep what matters inside the dashed box. The gray circle is your profile picture.
Open on their problem, in their words. Keep the logo small.
Links, landscape posts, video covers and Google updates.
The home page, top of the screen.
Larch & BasaltHomesHow We BuildAboutContactBook a ViewingMountain modern homes in stone, timber and glass, across Idaho.
Finished homes at dusk, warm light inside, cold mountains outside.
Everything is in the "Larch & Basalt brand kit" folder and zip. Hand it to anyone who makes things for the brand.
--color-primary: #BC945D; --color-ink: #1C1A18; --color-paper: #FDF9F5; --font-display: "Zodiak"; --font-body: "Switzer"; --text-h1: 3rem; --text-body: 1rem; --space-md: 1rem; --space-xl: 2rem; --radius-md: 2px;