메뉴
Anti-slop frontend framework for AI agents. Enforces better layout, typography, motion, and spacing to counter generic AI-generated boilerplate UIs. Use when building frontend, countering generic AI UIs, need distinctive visual design, image-to-code pipeline.
Codex 또는 Claude로 설치 이 Prompt를 복사해 Codex, Claude 또는 다른 어시스턴트에 붙여 넣으면 Skill 페이지를 검토하고 설치를 진행할 수 있습니다.
SOC 직업 분류 기준
| name | anti-slop-frontend |
| description | Anti-slop frontend framework for AI agents. Enforces better layout, typography, motion, and spacing to counter generic AI-generated boilerplate UIs. Use when building frontend, countering generic AI UIs, need distinctive visual design, image-to-code pipeline. |
| domain | content |
| tags | ["frontend","design","ui","anti-slop","taste","typography","motion","image-to-code"] |
Anti-slop frontend design framework based on Leonxlnx/taste-skill. Provides 13 specialized skills that enforce distinctive, production-grade visual design — countering the generic, soulless UIs that AI agents typically generate.
The framework covers layout systems, typography hierarchies, motion design, spacing discipline, and image-to-code pipelines across three visual style variants.
Core design taste engine. Injects layout/typography/color/motion constraints into agent output to prevent generic patterns.
Legacy taste skill for backward compatibility with existing agent pipelines.
GPT-specific taste calibration — adapts design constraints for GPT-based code generators.
Screenshot-to-production-code pipeline. Takes a reference image and generates pixel-accurate frontend code.
Audit and redesign existing frontend projects. Identifies anti-patterns and applies taste-skill improvements.
Premium visual design patterns — luxury brand aesthetics, editorial layouts, cinematic compositions.
Ensures agents produce complete, production-ready output — no placeholder content, no stub components, no TODO comments.
Minimalist design system — reduction to essentials, generous whitespace, restrained color palettes.
Industrial brutalist design system — raw typography, exposed structure, intentional roughness, anti-polish aesthetics.
Design taste layer for Stitch-based component generation — ensures consistent quality across stitched UI components.
Generate web-specific visual assets — hero images, section backgrounds, illustration sets — with consistent style matching the frontend design system.
Generate mobile-specific visual assets — splash screens, onboarding illustrations, app store screenshots.
Generate cohesive brand identity kits — logo variants, color palettes, typography pairings, icon sets, pattern libraries.
npx skills add Leonxlnx/taste-skill
Trigger phrases:
"anti slop frontend"
"Building any frontend UI from scratch"
"Countering generic AI-generated boilerplate designs"
"Need distinctive, production-grade visual design"
Building any frontend UI from scratch
Countering generic AI-generated boilerplate designs
Need distinctive, production-grade visual design
Running an image-to-code conversion pipeline
Redesigning existing projects with poor visual quality
Generating brand-consistent visual assets
| Rationalization | Reality |
|---|---|
| "Good enough content works" | Quality content drives engagement. Mediocre content gets ignored. |
| "I will optimize later" | SEO and distribution need optimization from the start. |
| "Templates are good enough" | Templates are a starting point. Custom content outperforms generic. |
Enforce staged execution discipline on large tasks: written stage plan, parallel sub-agent delegation, failable verification at each stage, and skeptical self-review before delivery. Use when tasks span multiple files, multiple sources, or multiple sessions. Also triggers on "do this thoroughly", "be systematic", "deep work mode", "be thorough".
Write production-quality code from specs — reads requirements, researches patterns, implements with tests, and iterates until verification passes. Use when implementing features, fixing bugs with known root causes, or building new modules.
Ship code to production through a controlled pipeline with verification gates and rollback plans. Use when deploying features, managing CI/CD, running database migrations, or performing post-incident hotfix recovery.
Investigate topics deeply with cross-referenced sources and produce evidence-backed findings. Use when evaluating technologies before adoption, analyzing competitors, or investigating bug root causes across docs and issues.
Read code changes with adversarial intent to find bugs, security holes, logic errors, and performance traps. Use when reviewing PRs, auditing refactoring for regressions, or running pre-deploy safety checks.
Detect and fix code style violations, enforce project conventions, and ensure consistent formatting across the codebase. Use when cleaning lint errors before PRs, migrating linters, or bulk-applying new rules.