How XONIK is written, set and drawn.
Every rule here says why it exists. A rule with no reason gets broken by the first person who has a good reason of their own.
The name
XONIK was chosen for how it sounds, not for what it stands for — there's no acronym behind it. Said aloud it has a pace to it: short, structured, and already carrying a technical edge before a single word of copy explains what the firm does. That was the test — a name that moves before the site around it does anything to help.
XONIK is written in full capitals, everywhere, without exception. Not Xonik, not xonik, not XoNik.
The one place it appears in lower case is where a machine requires it — a URL, an email address, a CSS class, a file name. Those are not the name; they are addresses that happen to contain it.
Why: a name that appears three ways across a site reads as three organizations to anyone skimming, and as carelessness to anyone reading.
The mark
Always the file. Never the letter X set in a typeface, however close it looks.
- Minimum height 20px on screen, 8mm in print. Below that the counter closes and it reads as a solid shape.
- Clear space on all sides equal to the height of the mark itself.
- Accent blue on light grounds; white on ink or accent. No other color, and never a gradient.
- Never stretched, rotated, outlined, given a shadow, or placed inside a container shape.
Why the file rather than the typeface: a substituted glyph is the commonest way this mark gets misused, and it shows immediately at small sizes — the proportions are wrong before the shape is.
Color
Blue, terra, one ink, and a set of grounds. Blue carries every message across the site; terra appears only inside diagrams, and only to mark the single point where the thing being drawn breaks — never as decoration, never on a button or a link; the grounds exist only to separate one band of a page from the next.
#004aad
Primary. Links, buttons, the intended path in a diagram.
#0e2f9e
Deeper accent, used sparingly for weight.
#b5502f
Diagrams only, one mark per drawing: the point where it breaks. Never buttons, never links, never decoration.
#141414
Text, and dark grounds.
#faf9f7
The page. Warm, never pure white.
#f2f0ec
Alternating sections.
#ede1c8
Guide covers, cost bands.
Pure white is used for cards only, never for the page. A warm ground behind white cards is what makes the cards read as objects rather than as gaps.
Typography
Two typefaces, both open license. Sorts Mill Goudy for display, Archivo for everything else.
- Headings are set at regular weight. The display face has no bold cut and does not need one — at heading sizes, hierarchy comes from size and space, not weight.
- Body text is Archivo at 400. Labels and eyebrows at 600, uppercase, with wide tracking.
- Measure is capped at about 68 characters for prose and 62 for dense text such as policies.
- Never substitute Goudy Old Style, EB Garamond or a system serif. They are close enough to look like a mistake rather than a choice.
Tiles and diagrams
Where another firm puts a stock photograph, XONIK puts a line drawing. Same job — a face you recognize at a glance — without the library every competitor is also drawing from.
- One idea per drawing. A diagram that would fit on any page is decoration.
- Line weight 1.5–2px. Accent blue for the subject, grey for context, nothing else.
- Every drawing carries a written description of what it shows, not a file name.
- Tiles sit on tinted grounds — accent wash or cream — never on white.
Photography
There is none, and that is the rule rather than a gap waiting to be filled.
No stock photography of any kind: no meeting rooms, no handshakes, no laptops on desks, no abstract blue networks. Every one of those images is on a competitor's site already, which means using it makes this firm look like that one.
Real photographs of real people and real work are welcome when they exist. Until they do, the drawings do the work.
Voice
- Short sentences. If one needs reading twice, it needs rewriting.
- Say the uncomfortable thing. "We are not certified to ISO 27001" earns more than any claim that avoids it.
- Name the source of every number, or do not use the number.
- No superlatives, no "leading", no "world-class", no "cutting-edge". They are what a firm writes when it has nothing specific to say.
- Write about the reader's problem before writing about our service. Every page on this site does that, and it is the whole structure.
What not to do
- Do not type the mark as a letter.
- Do not write the name in anything but full capitals.
- Do not add a color to the palette without removing one.
- Do not use a stock photograph.
- Do not publish a figure without its source.
- Do not describe an unreleased product as available.
The last two are not design rules. They are here because they are broken the same way — by someone in a hurry who means well.
Writing about us?
The media kit has the boilerplate, the logo files and the facts, all ready to paste. If something you need is not there, ask.