Why it matters
A page that looks like a template asks the visitor to trust a business that did not take the time to look like itself. When the same few defaults show up on thousands of sites, people learn to recognise them, much as they once recognised a stock theme.
The rules in this guide come from a review of 33 articles and studies on how AI-generated design looks. There are 41 of them, and each has an example page in two versions: one with the tell, one fixed, with the same words and layout otherwise.
The five fixes that matter most
If you only change five things, change these. Each one is a high-severity rule in the score.
1. Swap the purple gradient for one that models light
Indigo to violet, or purple to pink, is the colour of generated sites. A button can still have a gradient: one hue, lighter at the top, deeper at the bottom.
With the tell

Fixed

2. Remove the pill above the headline
A small rounded label saying "New" or "Introducing" over the main heading is a template habit. Put that news in a sentence, or leave it out.
With the tell

Fixed

3. Break up the wall of icon cards
Three or six identical cards, each with an icon in a tinted square, a heading and a line of text, say nothing about your business. Write fewer, longer points, or show the work itself.
With the tell

Fixed

4. Only show proof that is real
A strip of logos you never worked with, or big round numbers with no source, is worse than nothing once someone checks. Show a named client, a dated review or a qualification you can link to.
With the tell

Fixed

5. Clear out template leftovers
Old copyright years, placeholder names and builder badges tell visitors nobody read the page before it went live.
With the tell

Fixed

Gradients: allowed, with one rule
Gradients are not the problem. The problem is gradients with no light logic. A good gradient behaves like light on a real object:
- one hue family, lighter at the top and deeper at the bottom;
- a thin sheen near the top edge and a soft shadow of the same hue underneath;
- used on buttons, offer tiles and at most one coloured section, not everywhere.
What to avoid: violet to pink or cyan, rainbow and mesh backgrounds, gradient text, blurred glow blobs behind the hero, gradient borders on every card and frosted glass behind text.
Every tell, by kind
The full list, grouped the way the score groups them. Each links to its example pair.
Colour and gradient
- Hue-shifting 'AI' gradient: Use a single-hue tonal gradient that models light: lighter top, deeper bottom, thin sheen, same-hue shadow (e.g.
- Gradient text and gradient accent words: Solid ink headline.
- Blurred glow blobs behind the hero: Remove the blobs.
- Mesh, aurora or rainbow backgrounds: One brand colour section with a single-hue tonal gradient (e.g.
- Coloured glows on everything: Neutral or same-hue shadows with a vertical offset (light from above).
- Gradient borders on cards: Plain hairline borders in a neutral line colour, or separate content with spacing and rules instead of boxes.
- Glassmorphism on text containers: Solid surfaces for anything with text.
- Dark mode with neon accents: If the brand is dark, use a calm dark (ink or deep navy) with off-white text and one brand accent used sparingly.
Layout
- Everything centred: Left-align text on a grid.
- Walls of identical icon cards: Rank the points.
- Bento grid of rounded tiles: Lay out what you actually have.
- The template section order: Order sections by the visitor's questions for this business (what is it, is it for me, proof, price, how to start).
- Same large radius on every box: A small radius scale with roles (e.g.
- 01 / 02 / 03 numbered steps: Describe the real process with real timings in sentences or a plain ordered list.
Typography
- Untouched default type and greys: Choose a typeface with character for the brand, a warm or brand-tinted neutral scale and an off-white or brand canvas.
- Mono or tracked caps kicker above headings: Delete the kicker and make the heading say the specific thing.
- Accent words in headlines (colour or italic serif): One colour and one typeface per headline.
Components
- Eyebrow pill above the H1: Remove it.
- Chip walls: A short sentence or a plain list with a line of detail per item.
- Floating chips around the hero visual: Show the image unobstructed.
- Icons in tinted rounded squares: Drop decorative icons.
- Emoji bullets and emoji headings: Plain bullets or numbered rows.
- Component library defaults left untouched: Theme the kit with brand tokens: colour, type, radius scale, shadows, button family (depth / solid / ink).
- Cards with a coloured side or top stripe: Separate items with spacing and hairlines.
Imagery and decoration
- Fake UI built from divs: A real screenshot or photo of the real thing, with a caption saying what it is.
- Decorative grid or dot pattern behind the hero: Plain canvas, or a real image.
- Sparkles as the 'AI' signifier: Remove it.
Motion
- Everything fades up on scroll: Content visible by default.
- Staggered entrance on every card: Show lists at once.
- Hover lift and scale on every card: Hover feedback only on interactive elements, and keep it calm (colour, underline, a 1px press).
- Endless floating and pulsing decoration: No looping decoration.
- Infinite logo marquee: A static, short list of real clients you have permission to name, ideally each with what you did for them.
- Cursor-following glow or spotlight: Remove it.
- Typewriter or rotating-word headline: One fixed headline that says the specific thing.
- Parallax-scrolling decorative shapes: Static layout.
- Purposeless spinning hero object: Show the actual work, team or result.
Trust and fake proof
- 'Trusted by' strip of placeholder logos: Only real clients you may name.
- Inflated stat band: One specific, sourced figure in a sentence with its context and date ('41 kitchens fitted in 2025, all in Wessex').
- Avatar stack with 'Loved by 10,000+': A named review with a link to where it was posted, or the real review score from a platform with its count and date.
- Placeholder testimonials: Real quotes with permission: full name or first name and town, the job done, and one specific detail from their experience.
- Template and builder leftovers: Search the build for placeholders before launch.
Check your page
- Open the AI-look score, paste your page's HTML and check it at desktop and phone widths.
- For each rule that fires, read the evidence first. A rule is a heuristic, not proof: if you made the choice on purpose, it can stay.
- Compare your section with the fixed version of the example pair, change it, and check again.
- Aim for a score of 0 to 9 with no high-severity rule.
For a live site, or for motion and anything your scripts do, a developer can run the command-line version:
pnpm exec brand-detect https://your-site.co.uk
pnpm exec brand-detect https://your-site.co.uk --mobileFurther reading
Three of the 33 sources behind the rules:
- Why Every AI-Built Website Looks the Same (Blame Tailwind's Indigo-500), Alan West / DEV Community.
- 7 Signs a UI Has Been Vibe Coded (And How to Avoid Them), Jeff Humble / The Fountain Institute.
- 7 Tells that a UI is AI-Generated, Jeff Humble / The Fountain Institute (newsletter).