AI Averaging: Why All Products Have Started to Look the Same and How to Get Out of It

## Why this happens: The mechanics of averaging

When a model generates an interface without a clear context, it samples from a statistical training data center. The center is what is most common, looks neutral and will not offend anyone. Anthropic called it directly in the official Frontend Aesthetics cookbook in October 2025: "You tend to converge toward generic, on distribution" outputs. In frontend design, this creates what users call the "AI slop" aesthetic

But averaging has another layer: infrastructure.

In 2023, the developer under the nickname shadcn released a component library shadcn/ui: Radix UI primitives + Tailwind, without dependence, just copy the components to yourself. By 2026, it has more than 114,000 stars on GitHub, one of the most popular front-end projects on the platform. All AI tools — Cursor, v0, Lovable, Figma Make, Claude Code — are trained on the code shadcn uses. When you ask to generate an interface without additional context, you get the default shadcn form.

The result: the designer makes the layout in Figma Make, the developer generates in v0, the funder builds in Lovable – and all three get the same thing. Because all tools converge to one base.

## What AI-slop looks like: symptoms in category n

Not every generated interface is AI-slop. But there are steady signals.

Typography Inter or Roboto in each weight between 400 and 600. The difference between a title and a subheading is one and a half sizes, not three. 14px: Readable but impersonal.

Color One of two scenarios is either a purple-blue gradient on a white background or a completely neutral gray palette without an accent. Both signal: "There was no colour decision here.".

*Components * Three or four columns of identical cards. A button with the text “Get Started” or “Learn More” badge tag in each block. All this is shadcn with zero customization.

**Illustrations ** 3D characters without faces in impossible poses, holding luminous objects. Glassmorphism cards on a blurred background. This is the standard output of stock AI generators without brand context.

Space Generous indentations are everywhere – which is a good thing in itself, except when the space hides a lack of content strategy.

## Why is it not a model problem

The important difference is that this does not mean that AI is not capable of good design. This means that by default — no context, no constraints, no references — it chooses what is statistically safe.

It is easy to check: give the model specific limitations. "No Inter." One dominant color with one accent. Font weighing 200 and weighing 800 without intermediate gradations. An asymmetrical grid.” The result will be fundamentally different - the same model, a different context.

The problem is not the tool. The problem is that most people don’t give the tool anything but “make it beautiful.”.

## Four Ways to Get Out of Average

### 1. Banning defaults by name

The quickest lever is not to describe what you want, but to prohibit what you don’t want. "Don't use Inter, Roboto, Open Sans" works better than "use beautiful font" - because the ban cuts off specific high-probability defaults.

Anthropic released the official Frontend Design плагин in November 2025, a SKILL.md that explicitly bans overloaded fonts and forces Claude to choose a specific visual direction before writing code. Directions: brutalist, maximalist, retro-futuristic, organic, luxury, playful, editorial, art deco, soft/pastel, industrial. “Bold maximalism and refined minimalism both work – the key is intentionality, not intensity.”

It works because it forces you to choose. A model cannot evade “neutral” if you call neutral undesirable.

### 2. Pack the brand into a file

DESIGN.md, CLAUDE.md or SKILL.md is a brand rules file that reads AI before generating anything. Do not write beautifully, but specific parameters:

## Typography
- Never: Inter, Roboto, Open Sans, Arial
- Heading: Fraunces
- Text: Bricolage Grotesque
- Mono: JetBrains Mono
Contrast of scales: 200 vs 800, not 400 vs 600

#
One dominant color, one sharp accent
Prohibited: purple-blue gradient on white background
All colors in CSS variables, not online

## Components
Use existing components by name, do not create similar
Not a hand-roll button if you already have one

One such file applied to a project changes the result more than any prompts in a particular chat.

### 3. Provide visual reference, not textual description

Text prompt produces text-format output. The visual reference is visual. Claude Code can read images: look at the screen and reproduce the structure, rhythm of indentations, pairs of fonts with good accuracy.

Sources of reference for decreasing labor intensity: a generated concept from an AI tool → a screenshot of an existing site → a frame from Figma. The main thing is to give something specific. "Do Like Linear" works worse than a Linear screenshot.

### 4. Connect a real component system via MCP

If AI generates components without linking to the existing system, it invents a zero-customization version of shadcn. Figma MCP, shadcn MCP server, or proprietary MCP design systems give models access to real components by name.

Difference: Without MCP, AI writes a button that looks like Primary. MCP uses Button/Primary from your system directly. It's not a cosmetic difference - it's the difference between new junk in the codebase and a clean extension of the system.

## Shadcn is not the enemy

An important caveat that is easy to lose is that shadcn is a good library. Affordable, consistent, with a thoughtful API. The problem isn't her.

The problem is that zero-customization shadcn is used as the final design instead of the foundation. It’s like taking a wireframe for a finished product — everything works functionally, but there’s no identity.

Shadcn is the foundation. You need a brand on top of it.

## Outcome

AI generates the average because that's how the statistical center samples. It’s not a bug, it’s a default behavior without context.

The way out is not to change the instrument. The way out is to give AI a context that makes default impossible.

● Prohibit specific defaults by name (fonts, colors, patterns)
● Collect DESIGN.md or CLAUDE.md with brand rules
● Install Frontend Design plugin from Anthropic
● Provide visual reference, not just textual description
● Connecting a design system via MCP to prevent AI from inventing components