10 Dead Giveaways Your Website Was Generated by AI (and How to Fix Each)
Open ten AI-built landing pages and nine will share five of these tells: the blue-to-indigo hero, three identical cards, animate-pulse on the popular tier. Here is each giveaway, the exact class that produces it, and the fix.
Open ten landing pages built by AI tools in the past six months. Nine will share at least five of these patterns. Users have started clocking them too, sometimes consciously, more often as a vague "this looks generated" feeling. Both reactions tank conversion.
Here are the ten dead giveaways, what makes each one slop, and the specific fix.
1. The blue-to-indigo gradient hero
<section className="bg-gradient-to-br from-blue-600 to-indigo-800 py-24">
<h1 className="text-5xl text-white font-bold">Welcome to Our Platform</h1>
</section>The 200-290 degree hue band is the AI default: blue-500 (#3b82f6), indigo-600 (#4f46e5), violet-500 (#8b5cf6). Combine any two with a diagonal direction (to-br, to-r) and you have a near-universal signature. Cursor, v0, and Bolt all reach for it unprompted because it is statistically the safest token in the training data.
Fix. Pick a hue outside the band. Warm: 14 degrees (terracotta), 28 degrees (amber), 45 degrees (mustard). Cool but off-axis: 165 degrees (teal), 175 degrees (cyan-green). Or drop the gradient entirely. A solid #0a0a0a background with one accent reads more confident than any blend. See how to pick an accent color that isn't Tailwind blue.
Sailop flags this with the color-tailwind-default and gradient-ai-band rules.
2. Three identical cards in a features section
<div className="grid grid-cols-3 gap-6">
<div className="bg-white rounded-lg shadow-md p-6">...</div>
<div className="bg-white rounded-lg shadow-md p-6">...</div>
<div className="bg-white rounded-lg shadow-md p-6">...</div>
</div>The most overused frontend pattern of the era. Same shadow-md, same p-6, same rounded-lg, same icon-heading-paragraph rhythm in all three. Users read the first card and skip the rest, because the layout itself promises they are interchangeable.
Fix. Break the symmetry. Use a definition list (), an asymmetric grid (a 5fr 3fr split where the lead feature dominates), or a horizontal band. Vary the visual weight so the eye knows where to land. We made the full case for ditching three-card grids separately.
3. animate-pulse on the "popular" pricing tier
<div className="rounded-2xl border-2 border-indigo-500 animate-pulse">
<span className="badge">Most Popular</span>
</div>animate-pulse on the middle pricing card is so common that users have learned to ignore it. The throb signals "this is the AI-default recommended tier," not "look here." It also fights the copy: a card that breathes 0.5 Hz forever is noise, not emphasis.
Fix. Stop pulsing. Mark the recommended tier with type weight, vertical offset (lift it 16px above its neighbors), or a genuinely different card structure. Static contrast reads as a decision; animation reads as a default. More layouts in the anti-slop pricing page breakdown.
4. backdrop-blur-md on the nav
<nav className="sticky top-0 backdrop-blur-md bg-white/70 border-b border-white/20">Glassmorphic sticky nav, backdrop blur, 70 percent opacity, hairline white border. v0 produces this by default. So does Lovable. So does Bolt. The blurred-glass look hit saturation in 2024 and now reads as "I kept the defaults."
Fix. A solid background with a 1px border-bottom. Or no border, and let the body scroll cleanly behind a fully opaque bar. Or a colored nav that owns the brand instead of apologizing for it.
5. Inter (or DM Sans, or Poppins) as the body font
Five fonts cover roughly 94 percent of AI-generated frontends: Inter, DM Sans, Poppins, Roboto, Montserrat. Inter alone covers about 60 percent, and Geist (Vercel's default, and therefore v0's) is climbing fast enough to be the next fingerprint.
Fix. Pair a serif display with a quieter sans body: Bitter + Work Sans, Vollkorn + Manrope, Playfair Display + Source Sans. Or commit fully to a system stack, Georgia + Verdana, which loads instantly and signals zero. We covered why Inter is killing your brand and what to use instead.
6. The opacity-fade-up scroll reveal
opacity: 0 plus translateY(20px) plus ease-in-out, fired on every section by an IntersectionObserver. By the third reveal your eye has filtered the motion out, so you have paid the latency cost for nothing.
Fix. Vary entrance by section. The hero gets none (it is above the fold, so it should already be visible). Features get a clip-path wipe. Testimonials scale in. Pricing staggers from the side. Or cut scroll animation entirely; static layouts read fine and load faster. See motion slop and the fade-in-up reflex.
7. rounded-2xl on everything
Same rounded-2xl (16px) on cards, buttons, images, modals, badges, and inputs. Total radius uniformity is the tell that someone asked for a UI and shipped the default.
Fix. Vary radius by element size and role. Buttons: 3px or 6px. Cards: 0px or 12px. Images: 0px or a full circle. Modals: 16px. Pills: rounded-full. The relationship between sizes is the design; one radius applied to everything is the absence of one.
8. The terminal mockup with three colored dots
The macOS-window frame with three traffic-light dots (red #ff5f56, yellow #ffbd2e, green #27c93f) is shorthand for "look, code." It appears in well over 70 percent of developer-tool landings and adds zero information.
Fix. If the terminal earns its place, show real output: actual text, real ANSI colors, a blinking cursor. If it does not, remove the chrome entirely and let the code speak. We unpacked the terminal mockup problem on its own.
9. Centered eyebrow + h1 + subhead + button stack
An eyebrow pill with a sparkle emoji. Centered h1. Centered subhead. Centered button. Spacing in tidy multiples of mt-4 and mt-8. This exact vertical stack is the AI hero default, and once you see it you cannot unsee it.
Fix. Off-center the hero. Left-align the text and push visual content into a right column. Kill the eyebrow (you do not need a sparkle to announce a feature). Or go the other way and let one enormous h1 carry the whole hero alone.
10. "Get Started" as the CTA copy
This single phrase is the most common CTA in AI-generated output. No specific meaning, no urgency, no clue about what happens next.
Fix. Use a verb that names the action: Install via npm, Scan my codebase, Buy the bundle for 475 euros, Read the docs. The CTA should answer "what does clicking this do?", not "are we ready to onboard?" We catalog 40+ of these in the banned phrases reference.
How to fix all ten at once
You can fix the giveaways by hand, one at a time. Change the gradient, swap the font, kill the pulse, and your slop score drops incrementally. The catch: the next component your agent generates regresses straight back to the defaults, because nothing changed upstream. The path that holds is procedural.
npx sailop install
sailop init
# Generates sailop.config.ts with palette, fonts, and layout rules
# all seeded outside the AI-default attractorRun it once at the start of the project, point your agent at the resulting config, and every component inherits the constraints. Sailop's own 50 templates were built this way; each is structurally distinct, and none scores above 30 on the slop scale.
For the full walkthrough, see the definitive 2026 guide or the getting started docs.
Ship distinct.
SHIP CODE THAT LOOKS INTENTIONAL
Scan your frontend for AI patterns. Generate a unique design system. Stop shipping the same blue gradient as everyone else.