DEV Community

hao li
hao li

Posted on

css-slop-detector v0.2: from detecting AI slop to fixing it with one command

(upload hit HTTP 429 on 2026-10-11; PyPI link may 404 until re-uploaded)

Target: published:true, author haoli

Title: css-slop-detector v0.2: from detecting AI slop to fixing it with one command


title: "css-slop-detector v0.2: from detecting AI slop to fixing it with one command"
published: false

tags: css, python, ai, opensource

v0.1 of css-slop-detector
scored your CSS/HTML for AI-generated design cliches — the "AI slop" look:
oversized border radii, glassmorphism on everything, purple gradients, neon
glows, pure-black dark mode with no light toggle, giant centered hero titles.

v0.2 closes the loop: --fix detects AND fixes. One command rewrites the
flagged patterns for you.

pip install css-slop-detector

# preview first — writes nothing
css-slop --dry-run styles.css
# styles.css: 7 fixes (big-radius x1, glass x1, glow-shadow x1,
#   hero-center x1, no-light-mode x1, pure-black x1, purple-gradient x2)
#   — score 100 -> 0 [dry-run, nothing written]

# apply (original backed up to styles.css.bak first)
css-slop --fix styles.css

# changed your mind?
css-slop --restore styles.css
Enter fullscreen mode Exit fullscreen mode

What the fixer does — only patterns the scanner flags, nothing more:

  • big-radius → clamp border-radius ≥ 20px to 12px
  • glass → remove backdrop-filter: blur(...)
  • purple-gradient → swap purple/violet stops for neutral slate
  • glow-shadow → replace neon glow with a soft neutral shadow
  • pure-black → lift #000 surfaces to soft #1e1e1e
  • hero-center → shrink giant centered titles to 32px, left-align
  • no-light-mode → append a prefers-color-scheme: light hook block

It de-slops; it doesn't redesign. Works on .css and .html
(<style> blocks + inline styles), still stdlib-only, still CI-friendly
(--json, --fail-over).

Why not just prompt better?

Tools like pbakaus/impeccable work on
the generation side — they teach AI to design better, improving the prompt.
css-slop-detector works on the detection+fix side: it scores the finished
product's AI fingerprints, then rewrites them for you in one step. Different
ends of the same pipeline.

Links

21 smoke tests, all green. MIT licensed. Feedback welcome — what's the next
AI-slop fingerprint I should detect?

Top comments (0)