What a brand kit
has to survive.
A logo pack survives until the first thing nobody anticipated. A brand kit is the smaller, harder object underneath it: the set of decisions that lets everything downstream get made without asking. This page is what we hand over, why it is shaped that way, and one worked example — Lumina’s.
01 What we mean by a kit
Four properties. A deliverable missing any one of them will not hold, and we have watched each of them fail in someone else’s handover.
-
Tokenised
Every colour, size, radius and duration is a named value in one place, and no component carries one of its own. This is the difference between changing a brand and rebuilding a product.
-
Ruled, not suggested
A kit states what may never happen, not only what looks good. “The accent appears once per surface” can be checked. “Use the accent sparingly” cannot, and will be gone within two quarters.
-
Operable
It ships as the files that run the brand, not as a document describing them. A rule that lives only in a PDF is a wish. A rule that lives in the stylesheet is the brand.
-
Portable
It has to work in hands we did not choose — a developer hired next year, an agency brought in for a campaign. If it only works while we are holding it, we have sold a dependency.
02 What is in every kit
Seven parts. The list does not change per client; what fills it does.
-
01
Ground & palette
Named tokens with a stated job each — page base, raised surface, text, accent, hairline — plus the opacities that are allowed and the ones that are not. Never a page of swatches with no rule attached to them.
-
02
Type
Two faces at most, a scale rather than a list of sizes, and one sentence saying which face is never allowed to do the other’s job. Weights are enumerated: a weight not in the kit is not in the brand.
-
03
The mark
Construction, clear space, minimum size, and the one thing it may never do. Every mark has that one thing, and naming it is most of the work.
-
04
Motion law
Durations and easing as values, not adjectives. “Confident, never bouncy” is a mood board; one easing curve and three durations are a brand that still moves the same way after someone else touches it.
-
05
Layout
Gutter, maximum measure, radii, and the rhythm between sections. This is the part clients rarely ask for and the first thing that visibly decays without it.
-
06
Voice
What the firm says, and specifically what it refuses to say. The refusals do more work than the permissions — they are what a junior writer can actually apply on a Friday afternoon.
-
07
The handover
The token file, the faces, the source, and a short document that explains the reasoning rather than restating the values. The values are already in the code; the reasoning is the part that is otherwise lost.
03 A worked example — Lumina
Lumina is a private real-estate advisory in Amman, and a Zyrn client. What follows is their kit, not ours — their values, their faces, their rules, printed as they are. Each panel below is a specimen frame: inside it, Lumina’s system applies. Another firm’s brand is never recoloured to sit more comfortably in ours.
Nine tokens and one hairline value. The rule that makes it a kit rather than a palette: no component carries a colour of its own. Every surface on fourteen pages reads these names, which is why the whole set could later be replaced in a single file.
Where luxury finds its light.
Exclusive villas and residences in Amman’s most prestigious neighbourhoods — sourced quietly, represented properly.
Two faces, one enumerated weight on the display face. The enforceable sentence in Lumina’s kit is “display type is always the serif; never set a headline in the sans” — short enough to be remembered and specific enough to be caught in review.
The mark carries two drop-shadows and an amber bloom — a lift on the ground rather than a flat placement. It is the one element of their kit with light of its own, and it is the reason the wordmark reads on a photograph without a plate behind it. The mark on this page is printed under Lumina’s own treatment, not restyled to match this document.
--ease: cubic-bezier(.22, .68, .16, 1)
One curve, written once and referenced everywhere. A brand whose motion is described as “smooth” ends up with nine different curves inside a year, because nine people each decided what smooth meant. A brand with a token ends up with one.
| Gutter | clamp(20px, 5vw, 88px) |
|---|---|
| Maximum measure | 1440px |
| Radius | 10px · 18px |
| Faces | 3 × woff2, self-hosted |
| Third-party script origins | 0 |
The layout values are in the kit for the same reason the colours are: they are the part a new hand will otherwise guess at. Self-hosting the faces is a brand decision as much as a performance one — a font that fails to load is a brand that fails to load.
04 The test that matters
Any kit looks correct on the day it is presented. The question is what happens the first time the client changes their mind.
Six weeks after Lumina’s kit shipped, the client asked for a different palette — not an adjustment, a replacement. Every ground, every accent, every hairline. Eight tokens were replaced and one was added, in a single commit. No component was rebuilt.
See the re-base — Lumina, a caseThat is the only durable test we know of. A kit that cannot absorb a change of mind has quietly priced one in as a rebuild, and the invoice arrives later with someone else’s name on it.
05 How it is handed over
| Artefact | Form |
|---|---|
| Tokens | A single stylesheet block. The names are the contract; the values are free to change. |
| Faces | The licensed files themselves, self-hosted, with the licence in the folder. |
| The mark | Vector source plus the exact treatment as code, not as a screenshot of the treatment. |
| Source | The running site or product, in the client’s own repository, with no build step we did not explain. |
| Reasoning | One document covering why, not what. The what is already in the files and would only drift from them. |
It is the client’s from the day it ships. If a kit needs us in order to keep working, it was not finished.
06 What a kit is not
- The decisions that make the next hundred decisions cheap
- Enforceable in review by someone who was not in the room
- Owned outright by the client
- Short enough to be read in one sitting
- A positioning strategy — that is decided before this begins
- A campaign, or a set of layouts to be copied
- A sixty-page document nobody opens twice
- A guarantee against taste — it narrows the room, it does not furnish it
The brand kit is one of four Zyrn lines and is routinely engaged with the website line, because a kit with nothing running on it cannot be tested. The brand kit line · All four lines