Audits an existing React and Tailwind site for generic AI-looking design, interviews you about taste and audience, then reapplies a custom visual identity step by step with build and screenshot checks.
Claude Code
> /plugin marketplace add aahil62/unslop> /plugin install unslop@unslop
Codex
$ npx skills add aahil62/unslop -a codex
Cursor
$ npx skills add aahil62/unslop -a cursor
Gemini CLI
$ npx skills add aahil62/unslop -a gemini-cli
GitHub Copilot
$ copilot plugin marketplace add aahil62/unslop$ copilot plugin install unslop@unslop
OpenCode
$ npx skills add aahil62/unslop -a opencode
Windsurf
$ npx skills add aahil62/unslop -a windsurf
The rescue tool for sites you already built. Audit → interview → re-theme an existing React + Tailwind site into a custom identity — verified at every step, without breaking your build.
Most design skills generate new UI or lint one dimension of it. Unslop does neither: it takes a site you've already shipped and runs it through a single stateful pipeline — measure what's wrong, decide what "good" means for your brand, then apply it with a hard build-and-screenshot check after every change. The output of each stage feeds the next, and nothing claims "done" without evidence. It's a Claude Code plugin (Codex-compatible) with three stages:
/unslop:audit — scores your site against an evidence-based
anti-slop checklist: screenshots at 4 breakpoints, WCAG contrast checks, and a
static scan for the classic tells (default indigo buttons, purple-to-blue
gradients, transition-all, font-weight sprawl…). Output: DESIGN-AUDIT.md
with a score and file:line evidence. Read-only — it never touches your code./unslop:interview — asks about your brand, audience, and taste
one question at a time, then synthesizes a custom design lane: identity,
palette, type pairing, texture, motion budget, and one signature moment.
Rules-driven creativity — no preset menu, no two sites alike. You approve the
lane before anything changes./unslop:retheme — applies the approved lane systematically:
tokens → typography → section by section → states & motion. After every pass
the build must succeed and fresh screenshots are taken. Ends with a re-audit,
a before/after report, and a client-ready CLIENT-REPORT.html you can hand
to a non-technical site owner.A stock vibe-coded landing page (default indigo, purple→blue gradient, emoji icons, gray-on-white text failing contrast) scored 27/100. After one audit → interview → retheme pass into a synthesized "Print Run" lane — 100/100, WCAG AA in both light and dark, no horizontal scroll at any width.
| Before — 27/100 | After (light) — 100/100 | After (dark) |
|---|---|---|
 |
Claude Code:
/plugin marketplace add aahil62/unslop
/plugin install unslop@unslop
Codex:
codex plugin marketplace add aahil62/unslop
Other AGENTS.md-aware tools: clone this repo and point your agent at AGENTS.md — same workflow, same rules.
The audit and retheme stages use Playwright for screenshots and contrast checks. In the project being rescued:
npm i -D playwright && npx playwright install chromium
(If the chromium download is blocked, the scripts fall back to your installed Chrome.)
From your site's repo:
/unslop:audit # how bad is it, with evidence
/unslop:interview # define what *good* looks like for this brand
/unslop:retheme # make it so, verified pass by pass
skills/ audit · interview · retheme (the three workflows)
rules/ anti-slop-checklist.md (scoring rubric) · lane-synthesis.md (creativity rules) · client-report.md (deliverable format)
examples/lanes/ 4 worked design lanes — calibration for the synthesizer, not a menu
scripts/ screenshot.mjs · contrast-check.mjs · slop-scan.mjs (deterministic checks)
AGENTS.md Codex adapter
Freelancers: a before/after retheme with an audit score delta is a sellable
deliverable — and the retheme stage ends by generating it: a client-ready
CLIENT-REPORT.html with the score delta, before/after screenshots, and what
changed in plain language. Quote the outcome, not hours.
MIT — see LICENSE. Pre-pivot methodology kit lives on the
legacy-archive tag.
Stars on GitHub
Helps you take a change from a rough idea or bug report through to a tested, reviewed result, with each step handled by a focused skill. Its skills cover pinning down domain terms, designing module interfaces, diagnosing hard bugs, and reviewing changes against your repo's coding standards.
@mattpocockA development methodology for coding agents that makes the agent brainstorm before building, follow plans, run parallel work and finish branches in a disciplined way. You get fewer skipped steps and more consistent results from your coding assistant.
@obraGives your coding agent a planning, testing and review routine to follow on every task. It plans before building, checks changes with tests, has a fresh reviewer look for regressions, and saves repeated wins as reusable skills.
@affaan-mDeveloper tools for working on the React codebase itself. Provides skills for extracting error messages, managing and debugging feature flags across release channels, running Flow type checks, and fixing lint and formatting issues before committing.
@facebookAudits an existing React and Tailwind site for generic AI-looking design, interviews you about taste and audience, then reapplies a custom visual identity step by step with build and screenshot checks. Install it with the command on its page. It includes audit, interview, retheme. Its skills do not fire on their own yet. Free and open source.
Is this plugin yours?
Claim it with GitHubSubmit a pluginPromote it