framer.com
scanned 2026-06-05 09:52 UTC · defs 2026.08
category overview
the breakdown
4 of 27 patterns flaggedCrushed letter-spacing on display type
Crushed tracking
Display headings pulled tighter than ~-0.04em (crushed negative letter-spacing) is a default 'make it look designed' move that actually costs legibility — characters start colliding and the headline reads as a logo, not a sentence.
Gradient-heavy backgrounds (5+ elements)
Gradient bgs
5+ gradient-background elements means decorative blobs, glows, conic rainbow swirls, or 'aurora' panels everywhere.
Perma dark mode + medium-grey body text
Perma dark
Dark background + mid-grey body text (#a0a0a0 region, HSL saturation <15%, L 0.35–0.75) is the AI default for 'premium' feel.
✓ clean, no tells in this category.
Glassmorphism (backdrop-filter blur on translucent layers)
Glass
`backdrop-filter: blur()` on translucent layers is a 2021 trend that AI templates kept reproducing.
✓ clean, no tells in this category.
the four axes
slop: lower is better · system & AEO: higher is better
design slop
17/100
Mild
copy slop
not run
system · DESIGN.md
none
no DESIGN.md
AEO · agent-readable
not run
scan to evaluate
You've seen the score. Now fix it.
4 tells, heaviest first.
Crushed letter-spacing on display type+5
whyDisplay headings pulled tighter than ~-0.04em (crushed negative letter-spacing) is a default 'make it look designed' move that actually costs legibility — characters start colliding and the headline reads as a logo, not a sentence. ~76% of generated pages over-tighten their display type.fixBack off the negative tracking. Tighten display type optically, not destructively: -0.01em to -0.02em is plenty for large headings on most modern sans faces; many faces need zero. Let the typeface's own spacing do the work — if it looks loose, you probably picked the wrong weight, not the wrong tracking.ruleNo letter-spacing tighter than -0.03em on display type. Characters must keep their own shapes.
Gradient-heavy backgrounds (5+ elements)+4
why5+ gradient-background elements means decorative blobs, glows, conic rainbow swirls, or 'aurora' panels everywhere. This is the AI template equivalent of a 2008 MySpace page.fixAim for zero decorative gradients. At most ONE subtle gradient if it has structural purpose (a section background that aids hierarchy). Replace decorative gradients with: solid color blocks, a single tasteful photograph, real product UI screenshots, or negative space.rule≤1 gradient element total on the page.
Glassmorphism (backdrop-filter blur on translucent layers)+4
why`backdrop-filter: blur()` on translucent layers is a 2021 trend that AI templates kept reproducing. It always reads as decorative-for-the-sake-of-it and signals 'theme.css from a Bolt starter'.fixRemove all backdrop-filter blur. Use opaque surfaces with strong contrast. If you need depth, a single subtle box-shadow (0 1px 2px rgba(0,0,0,0.05)) does more with less.ruleNo `backdrop-filter: blur()` anywhere on the page.
Perma dark mode + medium-grey body text+4
whyDark background + mid-grey body text (#a0a0a0 region, HSL saturation <15%, L 0.35–0.75) is the AI default for 'premium' feel. The mid-grey body text fails WCAG AA and signals 'I let v0 pick the colors'.fixEither: (a) go full light mode with crisp dark text on cream/white, OR (b) keep dark but increase body text contrast to at least #d4d4d8 (L 0.85+). Better: ship both themes and respect `prefers-color-scheme`.ruleBody text on dark backgrounds must have L ≥ 0.85. No defaulting to dark — the user's system preference is the default.
npx slop-detect framer.com --fix