Brand
Two lines meet and neither gives way. Technology and people, screens and things, the hand and the machine. The studio works at the point where they cross.
The mark is two strokes that cross. One stands for people and the things they hold; the other for the technology and systems behind them. A studio that only did one would draw one line. We work where they meet.
1Two practices
Design and engineering, people and systems, running side by side.
2The crossing
They meet at one point. That point is the brief.
3The mark
A gap where one passes over the other: they cross without merging.
Software is for someone. We start from the person using it and bring in the technology that serves them, not the other way round.
In the identity
Plain words over jargon, and the solid stroke, the one made by people, always passes on top.
Screens are things people hold, in a room, in some light. We design them as objects as much as interfaces.
In the identity
Film grain and a key light over every page, hairlines with registration marks, colours named after materials.
Generated and automated where it saves time, made by hand where it matters. The work is in knowing which is which.
In the identity
A grotesque for everything that informs, and a calligraphic italic, one word at a time, for the moments a hand would write.
Primary
Ink on paper. The default, wherever the background is light.
Inverse
Paper on night, for dark screens and dark mode.
Brass
The rising stroke in brass, for covers and the one moment a page is about the mark.
One colour
Both strokes solid; the gap carries the crossing. For stamps, engraving, embroidery, laser cuts and one-ink print.
Mark only
When the name is already in view: headers, footers, signatures.
App icon
Favicons, avatars and integrations. Night tile, 22% corner radius.
At 16 px the gap nearly closes, so nothing depends on it alone: the difference in weight between the strokes still reads as one over the other.
Borrowed from materials rather than screens: paper, stone, graphite, ink and one warm metal. No gradients for their own sake, no neon.
The page. Warm, never pure white.
--background
Secondary panels and quiet fills.
--muted
Supporting text, labels, captions.
--muted-foreground
Text, the mark and the primary button.
--foreground
The one warm metal, for where things meet: the &, the ×, numerals, hover. Lightens to #e1b75c at night.
--gold
The page after dark. Warm black, like ink, not a blue screen.
--background (dark)
The machine
A grotesque drawn for screens, 400 to 700. Everything that informs: headings, body, labels, numbers. Headlines at 500 with −0.035em tracking.
The hand
A calligraphic italic, 400, in brass. Only ever a word or a sign at a time: the &, the ×, a year. Never a sentence.
Together
Software made by hand, for people who hold it.
The grotesque carries the sentence; the italic marks the one word a person would underline.
Every page is treated as a surface with body, not a flat field of pixels. Three layers do it, all below the text so it stays sharp.
Grain
Fractal noise at 7% (10% at night), blended over the background. The page has a tooth, like paper or film.
Light
A key light from the upper right in faint brass, a fill from the lower left and a soft vignette. Read as lighting, never as a shape.
Registration
Hairlines end in a short tick at each end, like the marks on a print sheet. They draw in from the left as the page loads.
The crossing outlives the logo. Wherever two things meet on a page, the meeting point is marked in brass.
Design×Code
The × joins a pair: two disciplines, two clients, two sides.
Design & product studio
The & in the tagline, the one serif in a line of capitals.
A divider: the mark between two hairlines, where one part of a document crosses into the next.
042026
Numerals and dates in brass: the system's index and the hand's date, side by side.
Things are drawn, not switched on. Lines come in like a pen, content settles like paper on a desk, and each page has one orchestrated moment at most. With reduced motion, everything starts in its final state.
We say: We design the product, then we build it.
We don't say: End-to-end AI-powered digital transformation.
We say: The checkout now takes two screens instead of five.
We don't say: A seamless, best-in-class experience.
We say: We used a model to draft the copy and rewrote half of it.
We don't say: Revolutionary generative solutions.
A hand holding a circuit
The cliché of the field, and it picks a side: the hand owns the machine.
A pixel and a brushstroke
Two logos glued together. Side by side is not crossing.
A gradient blob
All synthetic, nothing made. It could belong to any AI company.
One family
The same construction as the SIUX Studio mark. The product reads it as a chart; the studio reads it as a meeting.
A crossing, not a fusion
The two lines stay distinct. We don’t pretend people and technology are the same thing.
Made to be made
Two strokes and a gap. It survives a 16 px favicon, a rubber stamp and a thread.
A system, not just a logo
The crossing is in the type pairing, the materials, the motion and the words.