using-anti-slop
Router for the anti-slop family — twenty-two vendored skills that keep an AI-built interface from looking templated (the centred hero, purple gradient, three icon cards, Inter everywhere) and raise it
SKILL.mdskills/anti-slop/using-anti-slop/SKILL.md
GitHubUsing Anti-Slop
A router, not a rulebook. Pick the row that matches the task, load that skill, follow it. The skills live verbatim in skills/vendor/<name>/; each one's UPSTREAM.md says where it came from.
1. Pick by task
| You are… | Load | Why this one |
|---|---|---|
| Building a new page or landing and it must not look templated | design-taste-frontend |
reads the brief, infers a direction, strict pre-flight check before shipping |
| — same, and you want a second, differently-opinionated pass | hallmark |
anti-AI-slop for greenfield, audits, redesigns, and extracting a design from a URL or screenshot |
| — or Anthropic's own take on a distinctive, intentional look | frontend-design |
aesthetic direction, typography, colour and motion with a point of view |
| Aiming for a high-end agency finish | high-end-visual-design |
exact fonts, spacing, shadows, card structure and animation that read as premium |
| Motion-heavy landing where layouts must not repeat | gpt-taste |
randomised layout variance, AIDA structure, GSAP ScrollTrigger rules |
| Design image first, then code to match it | image-to-code |
generates the design, analyses it, builds to it |
| Upgrading an existing site without breaking it | redesign-existing-projects |
audits first, names the generic AI patterns, then replaces them |
| Critiquing, polishing or hardening a UI that already works | impeccable |
46 anti-slop patterns across 7 dimensions; commands such as critique, polish, distill, colorize |
| Structuring the page — hierarchy, grid, responsive composition | gridgeist |
product-specific structure instead of the stock section stack |
| Committing to a style so every page does not look the same | minimalist-ui · industrial-brutalist-ui |
one named, enforceable visual language each |
| Choosing palette, font pairing, style from a catalogue | ui-ux-pro-max |
searchable data: 67 styles, 161 palettes, 57 font pairings |
| Writing the design system down so it holds across pages | design-system (tokens) · stitch-design-taste (DESIGN.md) |
primitive → semantic → component tokens; an agent-readable anti-generic spec |
| Applying a ready theme to a page, deck or report | theme-factory |
ten preset colour + font themes |
| Implementing with shadcn/ui + Tailwind | ui-styling |
accessible components on Radix, utility-first styling |
| Brand — voice, identity, a brand-guidelines board | brand · brandkit |
messaging and consistency; premium identity boards |
| Generating a visual reference before code | imagegen-frontend-web · imagegen-frontend-mobile |
one mockup image per screen to build against |
| Checking against interface guidelines — accessibility, UX basics | web-design-guidelines |
Vercel's Web Interface Guidelines review |
| Depending on the old taste-skill behaviour exactly | design-taste-frontend-v1 |
kept only for that; the default is design-taste-frontend |
2. The chain for a new page
- Direction —
design-taste-frontend(orhallmark); add a style skill if the brief names one. - Structure —
gridgeist. - Tokens —
ui-ux-pro-maxto choose,design-systemto write them down. - Build — the family's own
using-designchain (design-setup→design-rules),ui-stylingif the stack is shadcn/Tailwind. - Polish —
impeccable. - Done —
design-ship-gate. A page is not finished on a skill's say-so; it is finished when the gate passes and a real browser (playwright-cli) shows it.
For a redesign, start at redesign-existing-projects and join the chain at step 3.
3. Rules
- Load one skill per step. Two direction skills at once give two contradicting briefs; pick one, finish, then take a second opinion if needed.
- Do not edit
skills/vendor/. To update a skill, re-copy it from upstream at a newer commit and update itsUPSTREAM.md. - 3D, canvas, motion or scroll effects belong to
using-web3d; come back here for the look. - If no row fits, say so and use
using-designdirectly.