Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
npx skills add BlackBeltTechnology/pi-agent-dashboard --skill anti-slop-frontendgit clone --depth 1 https://github.com/BlackBeltTechnology/pi-agent-dashboardWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/skills/blackbelttechnology/pi-agent-dashboard/anti-slop-frontend)<a href="https://agentmods.dev/skills/blackbelttechnology/pi-agent-dashboard/anti-slop-frontend"><img src="https://agentmods.dev/badge/skills/blackbelttechnology/pi-agent-dashboard/anti-slop-frontend/github.svg" alt="Measured on agentmods" height="20"></a>Or the 80×15 button, for a site that already has a row of RSS and ATOM ones. Only the verdict fits; the numbers stay here.
<a href="https://agentmods.dev/skills/blackbelttechnology/pi-agent-dashboard/anti-slop-frontend"><img src="https://agentmods.dev/badge/skills/blackbelttechnology/pi-agent-dashboard/anti-slop-frontend.svg" alt="Reviewed on agentmods" width="80" height="20"></a>- NVIDIA SkillSpector pass
What it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5.1 | $0.00147 | $0.03629 |
| Opus 5 | $0.00073 | $0.01814 |
| Sonnet 5 | $0.00029 | $0.00726 |
| Haiku 4.5 | $0.00015 | $0.00363 |
Grade A, and why
anti-slop-frontend scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 12d ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
How it starts
The opening of the file, as written. The whole thing — 259 lines — stays where its author put it; the contents beside it link to each section on GitHub.
anti-slop-frontend
A flat, mechanical checklist of the concrete signatures an undirected model emits when it tries to "look designed." Every rule here is countable or binary - you can mechanically verify pass/fail, not argue taste. That is the whole point: "it looks better" is not a check; "eyebrow count > ceil(sections/3)" is.
What this is, and is NOT
- IS an advisory catalog of AI-tells, scoped by surface kind.
- IS standalone - works with no tooling, in any React/Tailwind/HTML project.
- IS NOT a design philosophy, a loop, or a gate. It scores; it never blocks.
Relationship to frontend-mockup-loop
Different jobs, intentionally separate:
| frontend-mockup-loop | anti-slop-frontend (this) | |
|---|---|---|
| Shape | ground→contract→mockup→test→fix→learn loop | flat checklist |
| Basis | cite an external public rule (Nielsen, WCAG, Laws of UX) | codified AI-tell catalog |
| Authority | owns the hard gates (WCAG-AA, severity-4) | advisory only, drives the fix list |
| Domain | product UI, dashboards, flows | universal tells + marketing-surface tells |
When both are present: the loop's a11y floor and cite-a-source rule win. This skill feeds concrete failing items into the loop's FIX step. It never overrides a gate, and a tell here is never a reason to violate a cited rule.
Honesty note: these rules are curated taste, hardened into countable form. They are good defaults, not laws of nature. Every rule has an override path: when the brief explicitly asks for the "banned" thing, it is allowed - execute it with intent, not by accident.
The three dials (set once, up front)
State these before reviewing or generating. They gate which rules fire and how hard.
VARIANCE(1-10) - 1 = perfect symmetry, 10 = artsy chaosMOTION(1-10) - 1 = static, 10 = cinematic/physicsDENSITY(1-10) - 1 = art-gallery airy, 10 = cockpit/packed-data
Infer from the brief; don't silently use a baseline. Dashboards/data UI live high on DENSITY and low on VARIANCE/MOTION. Landing/portfolio live the opposite.
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 12d ago First seen · 259 lines · 147 tokens per session scan A 6e6927d5cf5c
anti-slop-frontend is a skill published in the GitHub repository BlackBeltTechnology/pi-agent-dashboard (280 stars, last pushed today), licensed MIT. It adds 147 tokens to every session and 3,629 once invoked, about $0.0007 per session on Opus 5. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-30.
Other skills, from other repositories
adaptive-interfaces
Use when designing for user preferences — motion sensitivity, contrast needs, colour schemes, text sizing, information density, or any interface behaviour that should adapt to individual needs.
token-architecture
Use when building or restructuring design token systems — global tokens, semantic tokens, component tokens, naming conventions, theming, and multi-platform token distribution.
responsive-patterns
Use when designing complex responsive layouts — breakpoint strategy, layout shifts, content reflow, responsive typography, container queries, and ensuring the experience works across the full device spectrum.
ui-composition
Use when building layouts, choosing colours, setting typography, establishing visual hierarchy, designing responsive behaviour, or making any visual design decision — ensures every visual choice serves both aesthetics and accessibility.
motion-choreography
Use when designing animation sequences, page transitions, micro-interactions, loading states, or any motion that communicates meaning — ensures motion is purposeful, performant, and safe for motion-sensitive users.
web-design
Penguin visual language for generated web pages and app UIs — GitHub-style simplicity with a single blue accent, light and pure-black dark themes, design tokens, component and chat-interface recipes, plus an opt-in warm paper editorial theme.