You can spot an AI-built website in three seconds: the oversized border radii, glassmorphism on every card, the purple gradient hero, neon glows, a pure-black dark mode with no light toggle, and a giant centered title screaming at you. The design is "fine" — and instantly recognizable as machine-made.
I got tired of squinting at my own generated pages wondering how obvious they were. So I built css-slop-detector: it scores your CSS/HTML from 0 to 100 for AI design cliches, with every finding named.
git clone https://github.com/hahahahahahahahah6/css-slop-detector
cd css-slop-detector
python3 css_slop.py scan style.css
styles.css: score 68/100 (slop)
L12 [big-radius] oversized border-radius (32px) on '.card'
L12 [glass] backdrop-filter blur on '.card' (glassmorphism)
L15 [purple-gradient] purple/violet gradient on '.hero'
L22 [hero-center] giant centered title (font-size: 72px) on '.hero h1'
L1 [no-light-mode] dark-only design: near-black backgrounds with no
light-mode toggle or prefers-color-scheme: light found
Seven rules total — big-radius, glass, purple-gradient, glow-shadow, pure-black, hero-center, no-light-mode. Scores run 0–20 clean, 21–50 mild slop, 51–80 slop, 81–100 peak slop. It reads .css files and .html files (scanning <style> blocks and inline style="..." attributes), emits --json for scripts, and --fail-over 50 turns it into a CI gate: any score over 50 fails the build.
This is the opposite bet from design-skill collections like impeccable or ui-skills: those teach AI to generate better design. This one detects the finished product's AI fingerprints so you can de-slop before shipping.
One file, stdlib only, Python 3.9+. 8/8 tests pass. MIT licensed.
Repo: https://github.com/hahahahahahahahah6/css-slop-detector
What's the most obvious AI-slop tell you've seen on a real website?
Top comments (0)