01–06Brand book
The loom,on one page.
The mark, the colours, the type and the voice, with the files to download. For press, partners and anyone, or any agent, who needs to describe Brighterloom correctly.
01The mark
Three threads each way, woven once.
Three warp threads over three weft threads, in plain weave: every crossing alternates. The middle weft is the ember thread. It goes over, under, over: under exactly once, at the centre, where the system holds it.
- Clear space. A quarter of the mark's width on every side.
- Smallest size. 16 px on screen, 6 mm in print. Below that, use the name alone.
- The name. One word, one capital: Brighterloom. Never BrighterLoom or BRIGHTERLOOM in running text.
- Leave it alone. Don't recolour the threads, outline the mark, turn it, or move the ember thread. The gaps take the colour of whatever it sits on.
02Colour
Carbon and bone, one ember.
Warm neutrals tinted towards the ember, never cool greys. About nine tenths of any screen is neutral, and the ember marks one thing per view: the thread that matters.
- Bone
#F4F1EA - 75
#EDE9E0 - 100
#E7E2D8 - 200
#CFC9BD - 300
#ADA79C - 400
#8C867C - 500
#6B665E - 600
#4F4B45 - 700
#3A3733 - 800
#262422 - 900
#181716 - Carbon
#0E0D0C
- 300
#FFA27A - Ember
#FF6A2B - 600
#E8551A - Ember on paper
#B8410F
| Role | Token | Night shift | Day shift |
|---|---|---|---|
| Page | --color-bg | Carbon 950 | Bone 50 |
| Raised surface | --color-surface | 900 | 100 |
| Text | --color-text | Bone 50 | Carbon 950 |
| Secondary text | --color-text-muted | 300 | 600 |
| The one emphasis | --color-emphasis | Ember 500 | Ember 700 |
03Type
Large and light, then plain.
Three faces and no more. Fraunces carries the headlines, light and large, with one italic word for the meaning. Geist does the reading. Geist Mono labels, counts and measures.
We weave AI into the work.
Quote requests read and summarised, technical email drafted in the client's language, follow-up that doesn't slip. Your team reviews and decides.
01Quote request assistant
| Token | px | Face | Use |
|---|---|---|---|
--text-display | 48–128 / 0.98 | Fraunces 300 | Hero headline and the footer's name only |
--text-4xl | 48 / 56 | Fraunces 300 | An inner page's title |
--text-3xl | 40 / 48 | Fraunces 300 | A section heading |
--text-lg | 20 / 28 | Geist 400 | The lead under a heading |
--text-base | 16 / 24 | Geist 400 | Running text, never smaller |
--text-xs | 12 / 16 | Geist Mono 400 | Eyebrows, numbers, labels; capitals, +0.08em |
04Voice
Plain, specific, checkable.
- Name the outcome. Say what the system reads, writes or saves, in the reader's own terms: RFQ, STEP file, ERP, quote.
- Put a number on it, and say where the number comes from.
- If a competitor could paste the sentence onto their own site unchanged, rewrite it.
- Buttons say what happens next: “Book a call”, “See the audit”.
NotUnlock the power of AI-driven quoting.
ButReads the RFQ, measures the STEP file and drafts the reply in German.
NotTrusted by 100+ manufacturers.
ButA sample audit for a shop we made up, so you can read the deliverable before you pay.
NotSeamless integration with your stack.
ButAccepted quotes go into the ERP without retyping, if the ERP takes imports.
NotLearn more
ButSee the audit
05On the page
Structure is the decoration.
The site is drawn like a technical drawing: numbered sections, hairlines, title blocks. What you would receive is shown as paper. These are the pieces, live.
- Title-block eyebrow
02Services
- A stamp, one per sheet at most
Draft · not sent
- A figure that says where it comes from
- Calculated98.5 cm² × 800 bar = 788 kN ≈ 80 t per cavity.
- Every page prints as a drawing
- A4 sheets with a reference, revision and sheet number in the margin, and the title block last.
06Files
Take what you need.
Every page also has its own share card, drawn as a sheet: add /opengraph-image to its address. Questions about using the mark: hello@brighterloom.com.
- The mark on carbon
SVGDownload ↓ - The mark on paper
SVGDownload ↓ - App icon, 180 × 180
PNGDownload ↓
