The thirty tropes

Two saturated hues blended across a hero or button is the fastest way to say the palette was never decided. It reads as a placeholder for a brand.

Antidotes: One solid base and one accent, decided on purpose, Tonal wash: a single hue, lightness shifted at most ~15%, Grain or paper texture instead of a colour blend

#ffffff is the absence of a decision. Paper is never pure white, and a slight cast is what makes a page feel like a surface instead of a viewport.

Antidotes: Off-white with a hue cast (warm, cool, green, grey) chosen to fit the brand, In dark mode, a coloured near-black rather than #000

Giving every feature its own hue means no colour carries meaning. Colour should be spent, not distributed.

Antidotes: One dominant hue, one accent, neutrals doing the rest, Analogous scheme, or monochrome plus a single complement

Tailwind's demo accent is indigo and generated dark modes default to near-black; together they became the uniform of AI landing pages.

Antidotes: A brand hue chosen from the subject's own world (materials, place, era), Warm or tinted neutrals instead of pure black

Electric cyan, magenta and lime on black read as a sci-fi template. Sophisticated palettes are usually less saturated than the defaults.

Antidotes: Desaturate: pull chroma down and let value contrast carry hierarchy, Derive the accent from the brand, not from the colour picker

Several low-saturation, high-lightness tints together feel like a template for a wellness app. Pastels need a dark anchor to hold a page.

Antidotes: A palette with a full value range and one saturated anchor

These are the fonts that ship with the frameworks, so they are what a model reaches for. A typeface is the single cheapest way to give a page a voice; using the default forfeits it.

Antidotes: Archivo (wide display) + Newsreader (text) + JetBrains Mono, Bricolage Grotesque (display) + Public Sans (text), Fraunces (display) + Hanken Grotesk (text), Schibsted Grotesk (display) + Source Serif 4 (text), Big Shoulders (display) + IBM Plex Sans (text) + IBM Plex Mono, Always pair a display face with a text face; never one family for everything

Icon, heading, two lines, times three. It is the most recognisable generated layout because it says nothing specific about the product.

Antidotes: Alternating one- and two-column rows that follow the content, A single detailed feature with real screenshots, then a compact list for the rest, A comparison table when the features are genuinely comparable

White, grey, white, grey: the background changes because the template said so, not because the content shifted.

Antidotes: Change background only at a genuine change of subject, Use spacing and type rhythm to separate sections

Rounded tiles of varying spans look organised while hiding that nothing was prioritised. The grid becomes the content.

Antidotes: Editorial layout: one lead element, supporting rows beneath, A modular grid whose spans follow content priority, not decoration, A table when the content is actually tabular

Starter, Pro (most popular), Enterprise: a structure copied from a thousand pages regardless of how the product is actually sold.

Antidotes: One clear price with a usage note, or two plans, A calculator when price depends on usage

The small rounded pill ('New', 'Now with AI', 'Backed by...') sitting centred above the H1 is a template reflex, not an announcement. Fieldbook's addition to the list.

Antidotes: Lead with the headline; put news in a dated note or the changelog, An eyebrow line in condensed caps that says what the page is, not that it is new

Lucide ships as the default in shadcn/ui, so its 2px rounded strokes appear in most generated interfaces. The set is fine; the problem is that it is never chosen.

Antidotes: Phosphor (pick one weight), Tabler Icons, Radix Icons, Iconoir, Match stroke weight to the typeface weight; use one set only

Emoji render differently on every platform and carry a chat register. As section markers or bullets they signal that no icon system exists.

Antidotes: One SVG icon set, or no icon at all, Numerals or short labels when the marker carries information

The four-point sparkle has become shorthand for 'AI feature'. It tells the reader nothing about what the feature does.

Antidotes: Name the capability plainly and use a concrete icon, or none

Big soft shadows under every card fake depth the layout does not have. Depth should come from the surface system, not from blur.

Antidotes: Hairline borders and tonal surface steps, One reserved elevation for things that actually float (menus, dialogs)

Frosted panels over blurred colour need something worth blurring. Over a flat page they are an effect with no cause.

Antidotes: Opaque, matte surfaces with a real layering order, If translucency is deliberate (a brand choice), keep it to one component and mark it intentional

The same 12-16px radius on buttons, cards, inputs and images flattens hierarchy. Radius should encode role.

Antidotes: A radius scale by role: sharp for containers, small for controls, pill only for chips, Zero radius as a deliberate choice for editorial or technical products

Blurred coloured circles floating behind a hero are the default 'atmosphere' when there is no imagery. They are decoration for an absence.

Antidotes: Real imagery of the subject, Negative space and one geometric accent, Texture (grain, paper, halftone) over blur

The dotted-paper pattern behind heroes is the second most common 'atmosphere' and, like the orb, replaces a decision with a texture.

Antidotes: A brand-specific graphic device, or none, Fine grain at low opacity if a texture is needed

Shimmering grey blocks are a fashion for pretending speed. Often the content could simply be server-rendered.

Antidotes: Render on the server; stream only what is genuinely slow, Meaningful progress or a plain loading line

A bouncing scroll-down chevron or an arrow that slides on hover adds motion where a label would do.

Antidotes: A static affordance with a clear label

When cards, headings and images all lift or scale on hover, nothing signals interactivity anymore, and the page twitches under the cursor.

Antidotes: Motion only on elements that do something; colour or underline change is enough, Honour prefers-reduced-motion

Model-written copy leans on the em dash to splice clauses. Humans use it too, so this is a weak signal on its own.

Antidotes: Full stops, commas, shorter sentences

Negating a thing nobody claimed is rhetorical filler. Say what the thing is.

Antidotes: Direct, specific claims with a number or an example

A tick in front of every line turns prose into a pricing table. Ticks mean 'included'; use them only where inclusion is the question.

Antidotes: Plain or numbered lists; prose when the items are arguments, Reserve ticks for comparison tables

Invented quotes with stock avatars are not a design flaw, they are a lie on the page. Treated as a hard fail, never averaged into the score.

Antidotes: Real, attributed quotes with a link, or none, Case studies with numbers you can defend

A site that collects anything and has no privacy or terms page is not finished. Hard fail.

Antidotes: Real privacy and terms pages written for this product, linked in the footer

Three traffic-light dots over a fake shell is set dressing. If there is code to show, show it; if there is a product, show the product.

Antidotes: Real screenshots or an embedded live demo, Plain syntax-highlighted code without fake chrome

If the page cannot show the product, it is describing an idea. Illustrations and abstract shapes in place of screenshots are a hard fail.

Antidotes: A live embed or sandbox, Real screenshots, annotated, A short screen recording