threads

07Identity system & generative software

Dynamic Identity

A small generator that redraws the mark itself — seeded and deterministic, legible from a business card down to a 16px favicon.

Client
Threads (in-house)
Year
2026
Role
Concept, generation logic and implementation
Built with
Canvas, a seeded PRNG, a Lit custom element

One identity.
Never the same twice.

This front page already works this way: one stitched hero, picked at random on every visit, out of fourteen. Dynamic Identity carries that same idea down to the smallest unit of the mark itself — a generator instead of a fixed file, seeded so any single result can still be reproduced exactly.

Live — stitches in, holds, unpicks itself, and re-stitches. Click it to skip ahead.

A zigzag,
not a knot.

The stitch is a real one: a continuous zigzag, the way a sewing machine actually lays thread, rather than an illustration standing in for thread. Direction, peak count and amplitude are redrawn on every generation — the rule stays fixed, the result never repeats.

01 / Direction

Horizontal or vertical.

Each generation picks an axis to cross the square on, chosen fresh.

02 / Count

Six to ten peaks.

More or fewer stitches, spaced with a little give rather than a ruled grid.

03 / Tail

One end left loose.

The far end keeps running past the square instead of stopping flush at the edge.

Legible,
down to a favicon.

Same generator, four real sizes. The smallest one is the pixel budget a browser tab actually gives a mark.

128PX
64PX
32PX
16PX

Trimmed in the tile.
Loose everywhere else.

Inside a favicon, a browser clips to the square regardless, so the untrimmed tail above simply isn't drawn there — trimmed by the frame, not by us. Anywhere looser than a tile — this page, a loading state, a business card — it's left hanging, the way a seam actually looks before someone cuts the thread.

Built to
keep moving.

Not a fixed mark redrawn by hand for every new use, but a small generator that can sit anywhere in the system — favicon, loading state, a foil-stamped corner on a business card, a section break on this site — always the same rule, never quite the same seam.

Project context

Design and engineering: Threads, in-house. Every mark on this page is generated live in the browser from a seeded random source — reproducible on demand.