Skip to content
Codex DesignBETA

AI UI design tells, and how to avoid them.

People can spot an AI-made landing page in a second: the purple gradient, the centered hero, the three identical cards. These tells appear because agents fall back on the most common patterns when a brief leaves room. Here is how to recognize each one and how to brief your agent so it never shows up.

Updated November 5, 2026 · 8 min read

Why AI-made UI looks the same

A coding agent fills every gap in your brief with the safest, most common choice it has seen. Ask for “a modern landing page” and you get the average of thousands of modern landing pages: an indigo gradient, a centered headline, and a grid of rounded cards. Nothing is wrong with any single choice. Together they read as a template, and visitors notice.

The fix is not a cleverer model. It is a brief that leaves fewer gaps, plus a review step that looks for these tells on purpose.

The twelve tells

Visual style

  1. The purple-to-blue gradient. Gradient buttons, gradient headline text, or a soft violet glow behind the hero. It became the default “tech” look, so it now signals “nobody chose this”.
  2. Rounded corners and soft shadows on everything. Every card, button, and image has the same large radius and the same blurred shadow, so nothing stands out.
  3. Glassmorphism and glow. Frosted panels and neon outlines on a dark background, used as decoration rather than to show hierarchy.
  4. Emoji or generic icons as illustrations. A sparkle, a rocket, a lightning bolt in a colored circle, standing in for a real product visual.

Layout

  1. Everything centered. Centered hero, centered section titles, centered cards, centered footer. Centered text is harder to scan and removes any sense of direction.
  2. Three identical feature cards. Icon, two-word title, one vague sentence, repeated three times in a perfect grid.
  3. Uniform rhythm. Every section has the same height, the same padding, and the same structure, so the page has no emphasis and no pace.

Typography

  1. One font, one weight, no contrast. A single sans-serif at similar sizes, so headlines, labels, and body text blur together.

Copy and content

  1. Filler copy. “Unlock the power of”, “seamless”, “supercharge your workflow”, or headlines like “Fast. Secure. Simple.” They could describe any product.
  2. Vague social proof. “Trusted by 10,000+ teams” above a row of placeholder logos, and testimonials from “Sarah K., CEO”.
  3. Sections that repeat themselves. Features, benefits, and “why choose us” that make the same three claims in different words.
  4. Stock imagery. Abstract 3D blobs or generic illustrations instead of the product itself.

How to brief so they never appear

Most tells disappear when the brief makes the decisions the agent would otherwise make for you.

  • Name the art direction. “Warm and editorial, serif headlines, cream background” gives the agent a point of view. “Modern and clean” does not.
  • Set real constraints. Your brand colors, one accent color, your fonts, and a corner radius. A DESIGN.md file holds these once for every screen.
  • Give real content. Your actual product name, numbers, customer quotes, and screenshots. Specific content forces specific layouts.
  • Show references. A screenshot of a site you admire says more than a paragraph of adjectives.
  • Ask for directions that differ. Three deliberately different options make it obvious which one is generic. See how to design UI with Codex.

This prompt sets a direction before any design starts:

Set an art direction
Before designing, propose three distinct art directions for [product], each with: a one-line mood, a font pairing, a palette of at most four colors with one accent, a corner radius, and one layout idea that is not a centered hero. Avoid purple or blue gradients, glassmorphism, emoji icons, and three-card feature grids. Wait for me to pick one.

How to fix a page that already has them

Ask the agent to audit its own work against the list. It is good at finding the tells once you name them:

Audit for AI tells
Review this page for signs that it looks AI-generated: purple or blue gradients, the same radius and shadow on everything, glassmorphism or glow, emoji or generic icons, everything centered, identical feature cards, uniform section rhythm, a single font weight, filler phrases, vague social proof, repeated sections, and stock imagery. List each one you find with where it appears, then fix the five most noticeable and keep everything else the same.

Copy usually needs its own pass, because filler phrases survive visual fixes:

Rewrite filler copy
Rewrite every headline and feature description on this page. Each one must say what the user gets, include one concrete detail or number from our product, and avoid these words: unlock, seamless, supercharge, effortless, powerful, revolutionize, elevate. Keep the length similar.

And for the layout:

Break the template layout
Redesign the features section so it no longer uses three identical cards. Give the most important feature twice the space, show each feature with a small UI visual drawn in HTML, left-align the text, and vary the section rhythm so the page has one clear moment of emphasis.

Skills that help

Design skills exist largely to counter these defaults. Taste Skill and Anthropic’s frontend-design skill both push agents away from templated choices such as generic fonts and purple gradients. See the best Codex skills for UI design.

Compare before you ship

Tells are easiest to see next to an alternative. Put the original and the revised version side by side, in two browser windows or on a canvas, and the generic one will look obvious. That is what Codex Design is for: every direction Codex creates appears next to the others as live HTML.

Frequently asked questions

Is it bad if my site looks AI-generated?

It costs trust. Visitors read a templated page as low effort, and a page that could describe any product does not explain yours. Specific, deliberate design makes the product look as real as it is.

Can I stop Codex from producing these patterns?

Mostly, yes. Put your art direction and constraints in DESIGN.md or AGENTS.md, install a design skill, and finish with the audit prompt above. Reviewing the result is still your job.

Are gradients and rounded corners always wrong?

No. Any of these can be the right choice when it is deliberate and fits the brand. The tell is using all of them by default, together, because nobody decided otherwise.

Keep reading

An independent plugin for Codex. Not affiliated with or endorsed by OpenAI.