The Wizard of AI
Back to Resources
Agent Skill Pack

Loop EngineeringAI Slop Detector

A single, focused Claude Code skill that audits any web UI codebase for 'AI design slop' — the generic, default-y patterns that make a site look machine-generated.

Download the Pack(.zip, 21 KB)

What It Catches

The detector combines a runnable regex scanner with a judgment-based pattern library, because half of slop is only visible to taste, not to grep.

  • Purple/indigo gradient heroes and gradient-clipped text
  • Glassmorphism, neon-on-dark accents, the Inter-everywhere default
  • Card-on-everything with uniform radius and shadows
  • Dead-centered single-column layouts and emoji in headings
  • Marketing-cliché copy: 'Supercharge', 'all-in-one', 'Scale without limits'
  • The 'anti-slop slop': editorial/luxury costumes — fabricated heritage ('Est. 1931'), defaulted Didone serifs, film grain, portentous purple prose

How It Works

scan.py sweeps your React/Next/Vue/Svelte + Tailwind code for mechanical signatures and weights them by severity. The patterns reference then guides the judgment pass: constellation-based calls where one signal is fine but five together are a verdict. Evals are included.

Note: A Newer Version Exists

This is the original release. The Astryx Design Skills pack ships an expanded v2 of this same detector (adds the dark dev-tool variant, the 'tasteful-middle' wave, bento grids, em-dash cadence) plus the Astryx Max design skill. Grab that pack if you want the full toolkit — this one if you want the lean, single-skill version.

How to Install

  1. 1Download and unzip the pack.
  2. 2Copy ai-slop-detector/ into your project's .claude/skills/ directory — or ~/.claude/skills/ for all projects.
  3. 3Ask your agent to 'audit this UI for AI slop' — or run scripts/scan.py directly for the mechanical pass.

Pairs With