{"enrichment":{"faq":[{"a":"Frontend-design guides you through a context-gathering protocol to understand your audience and brand personality, then commits to a bold, intentional aesthetic direction before writing code. Rather than defaulting to generic templates, it enforces deliberate choices in typography, color, layout, and interaction\u2014whether your direction is brutally minimal, maximalist, or any other cohesive style\u2014ensuring your interface has real visual personality and avoids AI-generated aesthetics.","q":"How does frontend-design help create a distinctive website that doesn't look generic?"},{"a":"Yes. Frontend-design produces production-grade UI components with meticulous attention to refined typography, color harmony, and spatial rhythm. It delivers working code that's ready to deploy, not placeholder mockups. The skill prioritizes building responsive, accessible interfaces with cohesive visual language while maintaining the intentional design direction established during the context phase.","q":"Can frontend-design build production-ready frontend components with custom styling?"},{"a":"Frontend-design rejects generic AI output by enforcing a protocol that gathers design context first\u2014understanding your audience, brand, and goals\u2014before committing to a specific aesthetic direction. This intentional approach, combined with production-ready code implementation, creates memorable user experiences with strong visual personality rather than defaulting to bland, off-the-shelf aesthetics.","q":"What makes frontend-design different from generic web design tools?"},{"a":"Frontend-design combines strategic design thinking with technical execution. It starts by establishing your visual direction through context gathering, then implements that vision with refined choices in typography, color, and layout. The result is a web interface with cohesive visual language and intentional aesthetic personality\u2014avoiding the flat, generic look of AI-generated designs and delivering interfaces that feel professionally crafted.","q":"How do I make my UI look professionally designed using frontend-design?"},{"a":"Frontend-design builds responsive, accessible web interfaces that stand out visually while working reliably across devices. It combines bold aesthetic choices with practical responsive architecture, ensuring your application maintains its distinctive visual personality and memorable user experience whether viewed on desktop, tablet, or mobile.","q":"Does frontend-design create visually striking web applications with responsive design?"}],"shadow_tags":["visual-hierarchy","design-systems","ui-aesthetics","responsive-web","creative-coding","brand-identity","interaction-design","design-patterns","frontend-styling","user-experience"],"summary_rewrite":"Frontend-design guides creation of distinctive, working web interfaces that reject generic AI output. It enforces a context-gathering protocol to understand your audience and brand personality, then commits to a bold aesthetic direction\u2014whether brutally minimal, maximalist, or any other intentional style\u2014before implementing production-grade code with meticulous attention to typography, color, layout, and interaction."},"files":[{"bytes":9569,"path":".agents/skills/frontend-design/SKILL.md","sha256":"15460069e73006e62498287bf101e860bf6fa6a9d7243297e0d17847f8c0f8be","url":"https://skillfed.io/files/AkaraChen/aghub/frontend-design/44c8dbb8/SKILL.md"}],"id":"AkaraChen/aghub/frontend-design","links":{"html":"https://skillfed.io/AkaraChen/aghub/frontend-design","md":"https://skillfed.io/AkaraChen/aghub/frontend-design.md","repo":"https://github.com/AkaraChen/aghub"},"meta":{"agents_supported":[],"first_seen":"2026-07-28","forks":17,"language":"TypeScript","last_updated":"2026-07-27","license":"MIT","name":"frontend-design","publisher":"AkaraChen","stars":271},"relations":{"similar":[{"id":"fengshao1227/ccg-workflow/frontend-design"},{"id":"holaboss-ai/holaOS/frontend-design"},{"id":"tech-leads-club/agent-skills/frontend-design"},{"id":"secondsky/claude-skills/frontend-design"},{"id":"AkaraChen/aghub/arrange"},{"id":"AkaraChen/aghub/quieter"},{"id":"troykelly/claude-skills/frontend-design"},{"id":"6BNBN/FlowPilot/frontend-design"},{"id":"vercel-labs/open-agents/frontend-design"},{"id":"digitalsamba/claude-code-video-toolkit/frontend-design"}]},"slug":{"owner":"AkaraChen","repo":"aghub","skill":"frontend-design"},"version":"44c8dbb8"}