Taste Vault
A library of web design worth stealing from, and a standing test of whether an AI model can tell what makes it good.
What this is
Every reference in here starts as a page somebody else designed. It gets screenshotted at full height, read down to its palette, its typefaces and the real numbers behind its spacing, and written up in three parts: why it works, how it is put together, and what breaks if you copy it without thinking.
Then the write-up becomes a build prompt — container widths, type scale, colour roles, motion, the defaults to avoid — and the prompt is handed to a model that never gets to see the screenshot. What comes back is published next to the original, at the same proportions, so you can slide one over the other and decide for yourself.
That last rule is the whole experiment. Copying a picture proves nothing. Rebuilding a design from nothing but a description of it means having understood the design.
Where it came from
I'm Gabs, and this is a side project. It started as one of those Saturdays where a question will not leave you alone.
The question was narrow. Anyone can now ask a model for a landing page, and almost all of them come back the same: the centred hero, the three feature cards, the gradient going nowhere. Is that the ceiling of what these things can do — or is it just what you get when nobody has bothered to tell the model what good looks like?
So I spent a hacking day finding out. A folder of designs I admired, a disciplined way to describe them, and a script that makes a model rebuild each one from the description alone. The day ended. The question got more interesting than the hack, and the vault is still here.
It is not a product and it is not trying to become one. Nothing is for sale, there is nothing to sign up for, and every prompt on the site is free to take with no attribution asked.
How to use it
Browse the wall
The gallery is everything in the vault. Narrow it by what kind of thing it is, by tag — hero, pricing table, bento, dark mode — or by rating. ⌘K searches names and tags, and also what a rebuild was made with, so typing
opusorgsapfinds the builds that used them.Open one
Inside: the full-height capture, the palette and typefaces read off the page itself, and the analysis — why it's good, its anatomy in real numbers, and what to watch out for if you borrow it.
Put the rebuild beside it
Side by side, as a wipe you drag across the two, or live in its own tab. This is where the model either got it or it didn't, and it is usually obvious within a second.
Take the prompt
Copy it into Claude Code, Codex, your editor or a chat window, and you get that design's system in your own project, with your own content. The prompts describe structure and never brand: no logos, no names, no borrowed marketing copy.
Compare the versions
Every rebuild is kept. The same brief run by a different model, at a different effort, with different craft skills folded in — all in one row. That row is the closest thing here to a result.
What is actually being compared
Two engines drive the rebuilds, both from the command line. Each run records exactly what it was — which model, how hard it was told to think, which skills were folded into the brief — so a version you are looking at can always say what made it.
Claude Code
Fable 5.1 · Opus 5.5 · Opus 5 · Sonnet 5 · Haiku 4.5
Codex CLI
GPT-6 Astra · GPT-6 Sol · GPT-6 Luna
A run can also be handed craft guidance before it starts: published skills — one person's rules for typography, for easing, for scroll motion, for prose that does not read as filler — pasted into the brief whole. None of them are mine, they only ever apply to the build and never to the write-up of the reference, and a build that used one says so on its badge. They are all worth reading on their own:
- frontend-designAesthetic direction — type pairing, palette, spacing, knowing what to leave out.anthropics/skills
- emil-design-engInteraction craft — easing, state changes, and the details nobody notices until they are missing.emilkowalski/skills
- transitions-devConcrete CSS for hovers, reveals and state changes — use its tokens rather than inventing durations.Jakubantalik/transitions-dev
- gsapScroll-driven motion — reveals on entry, pinning, scrubbing, parallax.greensock/gsap-skills
- humanizerThe wording of the placeholder copy, and nothing else about the page.blader/humanizer
There is no scoreboard, and there will not be one. Taste is not a benchmark, and I would distrust any number that claimed to have scored it. What the vault offers instead is the same brief built several ways, sitting next to the thing it was describing, and your own eyes.
The designs are not mine
Not one of them. Every reference is somebody else's work, kept here to study and linked back to where it came from. This is a set of notes about design, not a licence to any of it — and if something here is yours and you would rather it wasn't, say so and it comes down. No form to fill in, and nothing to argue about.