A hundred years of design, traced to its source.
Scroll through the century. Drag the object to turn it.
1926
Primitives
Keep scrolling
Every style began somewhere: a workshop, a printing press, a village wall. Provenance traces each one back to who made it, where and how, so you can learn from it and credit it.
This guide collects 81 of those styles from the last hundred years, and the older traditions beneath them. Each one comes with what it looks like, why it worked, a live recipe for the interface styles, what it was used for, and how to ask for it without ending up with something that looks generated.
The atlas
Search by name, material or idea. Point at any row to see its plate, then open the field notes.
No style matches that.
Try fewer words, or clear a filter.
The interface lab
One screen, sixteen surface styles. Pick one, press things, then copy its CSS recipe or a prompt written for your own tools.
Test your eye
Eight screens. Name the style. Every answer shows the tells that give it away.
The vocabulary
How the century fits together
Nothing arrives from nowhere. Ideas overlap, travel, split and come back. Four ways to read the same 81 styles.
When each discipline was busiest
Each band is a discipline. Its thickness is how many styles were in prominence that year. Drag across the chart to see who was in play. Curves are smoothed over seven years; the list uses exact dates.
A core sample of colour
Every column is one style and its four-colour palette. Read it through time, or re-sort by hue or by lightness to see how the century's taste for darkness and saturation moved.
Who fed whom
Dots are styles, placed by when they began and by their main discipline. Lines are editorial links between ideas, not proof of direct influence. Point at a dot to light up its roots and its echoes.
The pendulum between flat and dimensional
How dimensional each interface style looks, from flat (0) to highly dimensional (10), placed where it became visible. The grey line follows the main platform languages from Apple, Microsoft and Google. The scores are an editorial estimate, not a measurement. Select a dot to open it in the lab.
Roots and traditions
Painting, textile, floor-drawing and sacred-diagram traditions that are far older than any movement in the atlas. Each entry says who makes it, how, and how to learn from it with respect.
No entry matches that.
Try fewer words, or clear a filter.
The toolkit
Two small tools for the moment before you commit to a direction, and the moment before you ship it.
Find a starting point
Say what you are making and how it should feel. You get four styles to study, not an answer.
What are you making?
How should it feel? Pick up to three.
Any era in mind?
Does it look generated?
Thirteen defaults that make work look like everyone else's, human or not. Tick what applies to yours.
How to use it
A style is a starting point. Distinctive work comes from a specific idea and decisions you can explain.
Start with something real.
Collect a place, a material, a story and an audience. A brief that could belong to any brand will produce work that could belong to any brand.
Borrow a principle, not a costume.
Find out why a movement used its grid, texture or scale. Translate that logic into your medium. Do not copy a maker's signature.
Break one rule on purpose.
Choose a single exception and be able to say why. Random imperfection is still a default.
Check it before it leaves the room.
Run it through the generated-look review, then test it with someone who has not seen it.