zebweb
ZBW–BK–001
The book of
zebweb
The brand book.
Visual identity · v1.0 · Lincoln, UK
Scroll

Every Lincoln cafe, builder, salon, and shop deserves a website that matches the quality of what they actually do — not a £19/month template trap. Zebweb exists to make premium feel local, and local feel premium.

Stripes up. Stand out.
── 01 / The mark

The striped Z.

One letterform. Stripe-filled. The whole studio in 60×60 pixels.

Construction

Built on a 60-unit grid. Z stroke at 8 units, corner radius 14 units. Don't reconstruct — use the supplied SVG.

Clear space
½ X½ X

Always leave at minimum half the mark's width as breathing room on every side. More is fine, less is not.

Minimum sizes
16px
32px
64px
120px

16px is the absolute floor — favicon, in-line nav. Below that the stripes start to mush. Don't.

── 02 / Lockups

Five ways to say it.

Use horizontal by default. Stack only when you have to. Wordmark and mark stand alone when the other isn't possible.

A · Horizontal
zebweb

Default. Use everywhere — header, signature, deck cover.

B · Stacked
zebweb

For square containers — avatar, business card front, Instagram post.

C · Mark only

Favicons, app icons, anywhere too small for type.

D · Wordmark only
zebweb

Editorial use, hero typography, when the mark would compete.

E · With tagline
zebweb
Proper websites for Lincoln.

Reserved for cover art, decks, big-format applications. Don't stick this on every page.

── 03 / Variants

Six skins. One mark.

Pick the variant that matches the surface. Don't invent new ones.

Primary

Default everywhere. Cream-on-ink stripes. Works on light surfaces.

Inverse

Reverse stripe pattern for dark surfaces.

Volt

Accent-only — campaigns, special applications. Use sparingly.

Mono — cream Z

Single-colour. Solid cream Z on ink. Embroidery, small sizes.

Mono — ink Z

Single-colour. Solid ink Z on cream. Stamps, fax, low-res print.

Outline

Last resort. Where stripes can't render — engraving, etching.

── 04 / Don'ts

Six ways to ruin it.

The mark is fragile if you mess with it. These are the six things you don't get to do.

Don't stretch
Don't squash
Don't rotate
Don't recolour
Don't add effects
SOMETHING
ELSE
Don't crowd
── 05 / Colour

Three colours. No more.

Ink and limestone do the work. Volt is the spark. Don't add a fourth.

Ink
Primary · type, surfaces, the mark
HEX#0F0F0F
RGB15, 15, 15
CMYK0 / 0 / 0 / 94
Paper
Secondary · backgrounds, reverse type
HEX#FFFFFF
RGB255, 255, 255
CMYK0 / 0 / 0 / 0
Volt
Accent · CTAs, highlights only
HEX#C8FF3E
RGB200, 255, 62
CMYK22 / 0 / 76 / 0
Usage proportion
60% Paper
35% Ink
5%
── 06 / Type

Three voices, one feeling.

Fraunces speaks. Bricolage explains. JetBrains labels. Don't mix the jobs.

Fraunces
Display · Serif · Variable

Hero headlines and section titles. Use italic light weight for editorial emphasis on one word per headline.

Aa Bb
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 £$€¥ &@#%
Display · 96px
Proper websites
Lead · 32px
Built up the hill, with a steady hand.
Body display · 18px
Reserved for editorial pull-quotes only.
Bricolage Grotesque
Body · Sans · Variable

All body copy, UI labels, navigation. Set tight, kept honest.

Aa Bb
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789 £$€¥ &@#%
JetBrains Mono
Mono · Fixed-width

Prices, eyebrows, codes, postcodes. Always uppercase, always tracked at 0.2em.

Aa Bb
ABCDEFGHIJKLMNOPQRSTUVWXYZ
0123456789 £$€¥ &@#%
Pairing rule

Display in Fraunces, body in Bricolage, labels in JetBrains. Never swap. Never substitute.

Italic rule

Italicise one word per headline. The most important one. Not two. Not a phrase.

Tracking

Display: -0.04em. Body: default. Mono labels: uppercase, 0.2em. Never tighten body. Never loosen display.

── 07 / Imagery

Zebras and stripes.

The vector zebra family + the stripe pattern. Use one zebra per surface — they don't share.

A · Running
A · Running

Hero use only. Energy, motion, standing out.

B · Walking
B · Walking

Default illustration. Calm, steady, working.

C · Drinking
C · Drinking

Quiet sections. Refresh, breaks, bottom of page.

D · Sleeping
D · Sleeping

Coming soon, downtime, footer flourishes.

E · Zebra-print pattern

Tile this as a section background, use cropped slices as accents, or set it as a fill behind a card. Never as the only surface — always paired with cream or ink for contrast.

F · Stripe corner accent
Volt · 45°

Volt + ink corner stripe. CTA card top-right corners only — never as a full surface.

── 08 / Voice

Plain-spoken, quietly cheeky.

Write the way you'd talk to a small business owner over a flat white. Not a pitch. Not a press release. Just a chat.

Plain-spoken

Short sentences. Real words. No throat-clearing.

Honest

Say the price. Say the timeline. Don't oversell.

Quietly cheeky

A wink, never a wisecrack. Confident, never smug.

Specific

Name the thing. Lincoln. £350. Vercel. 48 hrs.

Write this, not that
We leverage innovative web solutions.
We build proper websites.
Embark on your digital journey.
Get a real site, sorted in 14 days.
A bespoke synergy of design and SEO.
We design it. We rank it. £200/mo.
Best-in-class, world-class service.
Same studio. Every job. Up the hill.
Unlock the full potential of your brand.
Looks proper. Loads fast. Earns you money.
Use these
propersortedfastfairreallocalup the hillliveshippedownedhonestLincoln
Banned
synergysolutionsleverageinnovativeworld-classbest-in-classjourneyecosystemunlockembarkbespoke (without reason)cutting-edge
── 09 / Applications

The brand in the wild.

How it shows up in stationery, signatures, invoices, and avatars.

A · Business card · Front
zebweb
A · Business card · Back
Louis
Founder
hello@zebweb.co.uk
01522 000 000
Steep Hill, Lincoln, LN2
B · Email signature
Louis
Founder · Zebweb
hello@zebweb.co.uk
zebweb.co.uk
Steep Hill, Lincoln
C · Invoice / quote
zebweb
Invoice
INV-0042
From
Zebweb
Steep Hill
Lincoln, LN2
Bill to
Sample Client Ltd
Lincoln Business Park
LN6 4AB
Website build · Tier 02 · 10 pages
£500
D · Avatars + favicons
Avatar · 120px
Touch icon · 96px
Favicon · 32px
Tab · 16px
zebweb
That's the brand. Don't be precious — use it.

A brand book is a starting point, not a cage. If you need something not in here, ask. Then we either add it or talk you out of it.

Document
  • ZBW–BK–001
  • v1.0
  • 2026
  • Lincoln, UK
Stack
  • Fraunces
  • Bricolage Grotesque
  • JetBrains Mono
  • Lucide icons