10 Dead Giveaways Your Website Was Generated by AI (and How to Fix Each)
Ten visual and structural patterns that immediately reveal AI authorship. Code examples, fix recipes, and Sailop rule references for each.
Open ten landing pages built by AI tools in the past six months. Nine of them will share at least five of these patterns. Users have started recognizing them too — sometimes consciously, sometimes as a vague "this looks generated" feeling. Both reactions tank conversion.
Here are the ten dead giveaways, what makes them slop, and the specific fix for each.
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° hue band is the AI default. Tailwind blue-500, indigo-600, violet-500. Combined with a gradient direction (to-br, to-r, to-bl) and you have a near-universal AI signature.
Fix. Pick a hue outside the band. Warm: 14° (terracotta), 28° (amber), 45° (mustard). Cool: 165° (teal), 175° (cyan-green). Or skip the gradient entirely — solid backgrounds with strong typography read as more confident anyway.
Sailop catches 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 modern era. Same shadow, same padding, same border-radius, same icon-heading-text rhythm. Users skip after reading the first card.
Fix. Use a definition list (), an asymmetric grid (5fr/3fr split), or a horizontal band layout. Whatever you do, vary the visual weight between items. We covered the full case for ditching three-card grids separately.
3. The animated pulse on the "popular" pricing tier
animate-pulse on the middle pricing card is so ubiquitous that users have learned to ignore it. The pulse signals "this is the AI-default popular tier" rather than "look here."
Fix. Stop pulsing. Highlight the recommended tier with type weight, position (offset upward), or a real visual difference (different background color, different card structure). Static differences read more confident than animations.
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 with backdrop blur and 70% opacity background. v0 produces this by default. So does Lovable. So does Bolt.
Fix. Solid background with a 1px border-bottom. Or no border at all and let the body scroll behind. Or a colored sticky nav. The blurred glass aesthetic reached saturation in 2024 — it now signals "AI defaults."
5. Inter (or DM Sans, or Poppins) as the body font
Five fonts cover 94% of AI-generated frontend: Inter, DM Sans, Poppins, Roboto, Montserrat. Inter alone covers ~60%.
Fix. Pair a serif display font with a quieter sans body. Bitter + Work Sans, Vollkorn + Manrope, Playfair Display + Inter, Cormorant + Source Sans. Or commit fully to a system stack: Georgia + Verdana, or system-ui + monospace. We covered why Inter dominates AI output and what to use instead.
6. The opacity-fade-up scroll reveal
opacity 0 + translateY(20px) + ease-in-out. Every section gets the same animation. By the time you scroll past the third one, your eye has filtered them out.
Fix. Vary the entrance per section. Hero gets nothing (it should already be visible). Features get clip-path reveal. Testimonials get scale-in. Pricing gets stagger from the side. Or commit to no scroll animations — static layouts read fine.
7. The `rounded-2xl` everything
Same border-radius on cards, buttons, images, modals, badges, inputs. Total radius uniformity reads as "I asked the AI for a UI and used the default."
Fix. Vary radius by size. Buttons: 3px or 6px. Cards: 0px or 12px. Images: 0px or full circle. Modals: 16px. Pills: rounded-full. Or pick one specific radius and use it on exactly one type of element.
8. The terminal mockup with three colored dots
The macOS-window mockup with three traffic-light dots is shorthand for "look, code." It appears in 70%+ of developer-tool landings and adds zero information.
Fix. If the terminal needs to be on the page, show actual terminal output (real text, real colors, real cursor). If it does not, remove the chrome entirely. Don't decorate code with fake window chrome — let the code speak. We unpacked the terminal mockup problem separately.
9. Centered eyebrow + h1 + subhead + button stack
Eyebrow pill with sparkle emoji. Centered h1. Centered subhead. Centered button. Spacing in multiples of mt-4 and mt-8. This exact pattern is the AI hero default.
Fix. Off-center the hero. Left-align text and put visual content in a right column. Or kill the eyebrow entirely (you don't need ✨ to announce a feature). Or make the h1 huge and let it fill the whole hero on its own.
10. `Get Started` as the CTA copy
This single phrase is the most common CTA in AI-generated frontend output. It has no specific meaning, no urgency, and no contextual information.
Fix. Use a verb that describes what actually happens. Install via npm, Scan my codebase, Buy the bundle for €475, Read the docs. The CTA should answer the question "what does clicking this do?" — not "are we ready to onboard?"
We catalog 40+ AI-generated copy patterns in the banned phrases reference.
How to fix all ten at once
You can fix giveaways manually one by one — change the gradient, swap the font, kill the pulse — and your slop score will drop incrementally. But the path that actually works is procedural.
npx sailop install
sailop init
# Generates sailop.config.ts with palette, fonts, layout rules
# All outside the AI-default attractorRun this once at the start of your project, point your AI agent at the resulting config file, and every component you generate inherits the constraints. Sailop's own 50 templates were built this way — each is structurally distinct, none score above 30 on the slop scale.
For the full anti-slop 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.