Anti Slop Design
Autonomous Principal Design Technologist and Anti-AI-Slop Specialist. Transforms messy, generic, vibe-coded prototypes and template-ridden UI into bespoke, human-grade, production-ready software. Use whenever building, styling, refactoring, or auditing web apps, SaaS dashboards, landing pages, mobile interfaces, Tailwind CSS, component systems, or when asked to "fix my UI", "make it look professional", "clean up AI slop", "improve UX", or "review frontend design".
Install
npx skills add wwewtech/anti-slop-design --skill anti-slop-designgit clone --depth 1 https://github.com/wwewtech/anti-slop-design.git /tmp/anti-slop-design
mkdir -p ~/.claude/skills
cp -r /tmp/anti-slop-design/. ~/.claude/skills/anti-slop-designPersonal skills live in ~/.claude/skills. Use .claude/skills in a project folder to share a skill with your team.
From the SKILL.md
# Anti-Slop Design: The Human-Grade UI/UX Engineering Skill
> **Mandate:** Eliminate generic AI design tropes ("нейрослоп", template clichés, boilerplate styling) and engineer distinctive, tactile, accessible, and commercially viable software.
---
## 1. Trigger Protocol & Agent Persona
### When to Activate This Skill
Invoke this skill automatically when any of the following conditions are met:
- Designing, scaffolding, or refactoring user interfaces (Web, SaaS, Landing Pages, Mobile).
- Implementing or adjusting CSS, Tailwind classes, typography, color palettes, or layout grids.
- Auditing UI code for design quality, visual hierarchy, UX bottlenecks, or accessibility.
- The user requests: *"make it look clean"*, *"fix the design"*, *"de-slop this app"*, *"vibe code polish"*, *"SaaS dashboard styling"*, *"premium feel"*, or *"improve UI/UX"*.
- Reviewing or transforming AI-generated prototypes into production-ready frontends.
### Autonomous Agent Mindset
You are not a passive chatbot giving theoretical advice. You are an **Autonomous Principal Design Technologist**. When invoked:
1. **Act Directly on Code:** Write concrete CSS variables, Tailwind classes, DOM structures, and component props. Never instruct the user to "click buttons in an inspector" unless operating an explicit interactive visual tool.
2. **Preserve Interactive Logic:** Never discard form state, data handlers, validation logic, or API integrations during visual refactoring.Details
- Skill name
anti-slop-design- Repository
- wwewtech/anti-slop-design
- License
- MIT
- Repo updated
- 21 October 2026
- Listed in
- karanb192/awesome-claude-skills
FAQ
What does the Anti Slop Design skill do?
Autonomous Principal Design Technologist and Anti-AI-Slop Specialist. Transforms messy, generic, vibe-coded prototypes and template-ridden UI into bespoke, human-grade, production-ready software. Use whenever building, styling, refactoring, or auditing web apps, SaaS dashboards, landing pages, mobile interfaces, Tailwind CSS, component systems, or when asked to "fix my UI", "make it look professional", "clean up AI slop", "improve UX", or "review frontend design".
How do I install the Anti Slop Design skill?
skills CLI (Claude Code, Cursor, Codex and more): npx skills add wwewtech/anti-slop-design --skill anti-slop-design. Skills go in ~/.claude/skills (personal) or .claude/skills (project), and Claude loads them automatically when a task matches the description.
Is Anti Slop Design popular?
It lives in wwewtech/anti-slop-design, which has 2 GitHub stars and 1 forks, and is included in 1 curated skill list.
Related skills
Build with Better Design
1better-designs/better-design-plugin
Build or redesign a web or mobile interface on a Better Design design system. Use when the user asks for an app, site, page, dashboard or component and wants it built on Better Design, or asks to choose, create or install a design system.
Tastegate
2stas4000/tastegate
Build or fix a frontend (landing page, marketing site, dashboard, app screen, component) so it looks designed, not AI-generated, and prove it in a real browser before calling it done. Picks a design direction first (taste), builds on a craft floor (impeccable-style rules), then runs scripts/gate.py, which renders the page at phone and desktop width and fails on overlapping text, sideways scroll, low contrast, tiny tap targets, AI purple gradients, gradient text, emoji icons, eyebrow labels, default fonts, three-equal-card grids and placeholder copy. Use for any UI build, redesign, polish or "m
Keyword Icons
1ruthless-coder-ai/keyword-icons
Generate clean monochrome PNG icons from a keyword — three distinct concepts per keyword, 1:1 aspect ratio, transparent background, recolorable, ready to drop into PowerPoint, Keynote, or docs. Use this whenever the user asks for an icon, pictogram, or "a simple graphic that represents X" (hospital, growth, contract, security, teamwork…), in any language, even if they never say the word "icon". Also use it when the user wants to recolor, resize, or tweak an icon made earlier.
Scrollytelling Brand Site
2abdelrhman2007/scrollytelling-brand-site
Build an award-level, scroll-told company website with a story told through scroll, a WebGL "layer by layer" 3D print scene, pinned sections, per-service 3D models, a projects gallery, an About page, an optional .NET + SQL Server CMS with contact inbox and private QR contact cards, tuned to near-zero idle CPU/GPU and fully responsive. Use when the user asks for an amazing, premium, Awwwards-style, scrollytelling or 3D website for a company or brand, wants "a site like the Demo House of Prototyping site", or gives a company profile or deck to turn into an immersive site.
Impresario
Shushant17711/impresario
Use when building, creating, designing, redesigning, animating or polishing any website, landing page, portfolio, product page, hero, microsite, component or app screen in any frontend stack — even when the user gives only a subject ("make a website for X") with no style direction. Autonomously invents a memorable, subject-specific concept and ships heavily animated, flowing, award-level (Awwwards style) work without asking the user for style choices. Also use when a result looks generic, templated, AI-made, flat, static or lifeless.
Visual Identity Designer
5ali4o/visual-identity-designer
Build a professional, precise visual identity (brand identity) for a project, startup, or business — logo direction, color system, typography, application mockups — via a structured 9-stage agency workflow ending in two polished deliverables — a Brand Identity Guide and a Design Language System (built with the docx skill, in the user's chosen language). Trigger any time the user attaches, pastes, or describes a project idea/brief and asks for a "visual identity", "brand identity", "logo", "branding", "brand kit", "brand guide", "design language system", "هوية بصرية", or similar — even without
Browse the most popular Claude skills, all frontend & design skills, or write your own with the skills generator.