Jonathon's AI Wiki

unslop-ui — Data-Driven Claude Skill for Removing AI-Generated Design Tells

4 min read

Source: raw/reddit-1u9sgj3.md (r/ClaudeAI, u/iamjohncarterofmars, score 152, posted 2026-06-19; repo github.com/JCarterJohnson/vibecoded-design-tells)

unslop-ui is a Claude skill that flags and removes the design patterns that make a website read as AI-generated. Unlike a hand-written banned-pattern list, every pattern it checks is frequency-weighted from a Reddit analysis of ~3.2 million posts across 47 AI and SaaS subreddits (2020-2026) plus 3,033 comments from 125 threads specifically about AI-built sites looking the same — so the highest-priority checks are the tells people actually name most often. It runs in two modes (steer-while-building and audit-existing-codebase) and ships a standalone Python scanner whose exit code can fail a CI build. The dataset, analysis scripts, and ranking charts are public.

Key Takeaways

  • Data-ranked, not opinion-ranked. Pattern weights come from how often each tell is named across ~3.2M posts + 3,033 comments — the differentiator from prescriptive guides like the Anti-AI Slop Guide. ^[inferred: the two are complementary — frequency ranking vs. fix prescriptions]
  • Top tells (highest weight): the default shadcn/Tailwind look, purple/indigo as the primary color, purple-to-blue gradients and gradient heading text, unprompted neon glow, emoji used as icons, the Inter/Geist default font, and the centered-hero-plus-three-feature-cards layout.
  • Deliberately leaves some patterns alone. Mesh/aurora backgrounds, bento grids, and glassmorphism are not flagged because the data does not show people minding them — it avoids nagging about non-tells.
  • Two modes. Build mode steers Claude away from the defaults while it writes the UI; audit mode runs a scanner over an existing codebase, reporting each finding with file + line + how to fix, and gives the whole project a “vibe score.”
  • CI-failable scanner. python3 devibe_scan.py ./src runs with no install beyond Python; --severity high filters to the strongest signals and --json emits machine-readable output. The exit code equals the count of high-severity findings, so a build can fail on it.
  • Provenance: standalone Reddit “Built with Claude” post; the linked artifact is the GitHub repo (dataset + scripts + charts). Repo stars/license/test status not verified at ingest — confidence medium pending repo inspection. ^[inferred]

Implementation

  • Tool/Service: unslop-ui Claude skill + devibe_scan.py scanner (github.com/JCarterJohnson/vibecoded-design-tells)
  • Setup: Import the skill into Claude Code or claude.ai, then ask Claude to build or clean up a site — it applies on its own. Or run the scanner standalone with only Python installed.
  • Cost: Free / open-source (dataset, scripts, charts public). ^[inferred]
  • Integration notes: Wire the scanner into CI as a quality gate — non-zero exit on high-severity findings fails the build.
# audit an existing codebase
python3 devibe_scan.py ./src
# only the strongest signals
python3 devibe_scan.py ./src --severity high
# machine-readable output for CI
python3 devibe_scan.py ./src --json
  • Anti-AI Slop Guide — the prescriptive banned-pattern reference (purple gradients, Inter, three equal cards, emoji icons); unslop-ui adds the frequency ranking + a runnable scanner on top of the same tell taxonomy.
  • Hallmark — anti-AI-slop generative design skill (audit/redesign/study verbs); unslop-ui is the data-driven detection-and-CI counterpart.
  • Impeccable v3 — design knowledge base with its own slop checklist; complementary to unslop-ui’s scanner.
  • AI Web Design — topic index.
  • Reddit — cross-cutting index of Reddit-sourced articles.

Try It

  1. Import unslop-ui into Claude Code, then ask Claude to build a landing page and confirm it avoids the top tells (no purple-to-blue gradient, no Inter, no centered-hero-plus-three-cards).
  2. Run python3 devibe_scan.py ./src over an existing project and read the per-finding file:line + fix and the project vibe score.
  3. Add python3 devibe_scan.py ./src --severity high as a CI step so builds fail when high-severity AI tells slip in.
  4. Compare its rankings against the Anti-AI Slop Guide — use the guide’s “Do This Instead” column to remediate what the scanner flags.

Open Questions

  • Repo license, test coverage, star count, and maintenance status were not verified at ingest — inspect github.com/JCarterJohnson/vibecoded-design-tells before relying on the scanner in production CI.
  • The skill’s exact pattern list and scoring weights beyond the named top tells are not enumerated in the source post.

Graph View

Backlinks