Why AI keeps making purple gradient websites

Ask an agent for a landing page without saying what it should look like and there's a good chance you'll get purple fading into blue. People noticed this quickly enough that it became a joke, and then a way of spotting a site nobody looked at very hard.

The short answer

Anthropic's name for it is distributional convergence. A model predicts what comes next based on patterns in what it was trained on. Safe, common design choices appear most often on the web, so without direction the model lands on them: the same fonts, purple on white, little motion.

Nothing in that process wants purple. The colour is simply the most likely answer to a question nobody asked precisely. It's one part of why AI-built websites all look the same.

The Tailwind story

You'll read that one person caused all this. The story goes that Adam Wathan, who created Tailwind CSS, picked indigo for the buttons in Tailwind UI around five years ago, that those examples spread across a great many sites, and that models trained on those sites learned indigo was what a button looks like. He's reported to have apologised for it, half joking, in a post in August 2025.

It's a good explanation and it may well be a large part of the answer. Treat it as a theory, though. The articles we read report the post second-hand and offer no measurement of how much indigo was actually in the training data, and we haven't found one.

It may be getting stronger

Some writers argue the problem compounds: AI-built sites go live, later models train on them, and the average drifts further. It's plausible, but we haven't seen it measured either.

Why changing the colour doesn't fix it

Purple is the visible part. The same process picks the centred hero, the pill badge, the three cards and the identical fade on every section. If you only change the colour you get the same page in teal, and if you ban purple the model picks the next most common palette.

To be clear, a purple gradient isn't wrong. It's only a problem when nobody chose it. Plenty of good sites use one on purpose.

What actually moves it

• Say what you want in values, not adjectives: named colours with roles, a real font, a type scale.
• Point it at a real page, so the most likely answer becomes that page rather than the average.
• Keep it in a file the agent reads every time, because the default comes back in the next session.

Our longer guide on making a vibe-coded site look professional goes through it step by step.