Avoid AI Design
Granska och skriv om frontend UI för att ta bort generiska `AI`-designkännetecken
Testad · Fungerar
Vad den gör
En frontend designgranskningsskicklighet som granskar `HTML/CSS` och React/Tailwind/shadcn efter mönster som får ett `UI` att se `AI`-genererat ut, och sedan skriver om det kring en bestämd estetisk riktning. Utlöses vid 'de-slop this UI', 'make this look less AI-generated', eller 'audit for AI design tells'. Levererar en 40-plus-katalog med `P0/P1/P2`-allvarlighetsgrad plus ett endast-detekteringsläge och ett skydd mot andra-ordningens standardinställningar.
Testrapport
Testades på en `AI`-slask-hero (indigo-till-violett gradient, gradient-clip headline, glassmorphism, Inter, emoji, 'Elevate Your Workflow', pil-`CTA`): den medföljande 40-plus-katalogen lät den flagga tio märkta problem med `P0/P1`-allvarlighetsgrad, och tvingade sedan fram ett åtagande till en namngiven estetisk riktning. Dess explicita skydd mot 'second-order defaults' som Space Grotesk och varma pappers-serif-huvuden avvärjer exakt den fälla som baslinjen utan skicklighet föll i, vilken fångade ungefär fyra kännetecken informellt och sökte en generisk ersättning. Referenskatalogen är ovanligt rigorös, med hänvisning till en Playwright-studie av ~1 400 webbplatser med en angiven falsk-positiv-frekvens.
Testad: 2026-07-19 · Claude Code 2.x (agent harness)
Installation
git clone https://github.com/funboy322/avoid-ai-design mkdir -p ~/.claude/skills cp -r avoid-ai-design ~/.claude/skills/avoid-ai-design
Kommandon och exempelprompter
/avoid-ai-designGranska och skriv om frontend UI för att ta bort generiska `AI`-designkännetecken
Skills triggas av vanliga förfrågningar — inga kommandon att memorera. Efter installationen aktiverar prompter som dessa skillen (på engelska):
De-slop this hero section, it looks way too AI-generated.Audit this component for AI design tells and fix them.Make this landing page look less like generic AI-generated design.