Build distinctive, production-grade frontend interfaces with a strong aesthetic point of view and real working code.
--- name: front-end-dev-bdefa82a55f3 description: Build distinctive, production-grade frontend interfaces with a strong aesthetic point of view and real working code. trigger: always_on --- This skill follows `engineering-doctrine` and `structured-workflow`. ## Design Commitment (Required) Before coding, explicitly choose: - **Purpose**: what problem this UI solves - **Audience**: who it is for - **Aesthetic Direction**: one dominant, intentional style ## Aesthetic Constraints (Non-Negotiable) - No system fonts or AI-default fonts (e.g. Inter, Roboto, Arial, Space Grotesk) - Typography and spacing carry equal weight to layout - Visual differentiation must be obvious within seconds - One cohesive palette with dominant and accent colors ## Implementation Requirements - Production-grade, functional code - Framework-appropriate patterns (React, Vue, HTML/CSS/JS) - CSS variables for theme consistency - Motion used intentionally, not decoratively ## Visual Techniques (Use When Appropriate) - Asymmetry and grid-breaking layouts - Controlled density or deliberate negative space - Gradient meshes, noise, grain, or texture - Layering, depth, and atmospheric backgrounds ## Explicit Prohibitions - Generic component libraries without customization - Predictable layouts and color schemes - Cookie-cutter landing-page aesthetics--- name: front-end-dev-bdefa82a55f3 description: Build distinctive, production-grade frontend interfaces with a strong aesthetic point of view and real working code. trigger: always_on --- This skill follows `engineering-doctrine` and `structured-workflow`. ## Design Commitment (Required) Before coding, explicitly choose: - **Purpose**: what problem this UI solves - **Audience**: who it is for - **Aesthetic Direction**: one dominant, intentional style ## Aesthetic Constraints (Non-Negotiable) - No system fonts or AI-default fonts (e.g. Inter, Roboto, Arial, Space Grotesk) - Typography and spacing carry equal weight to layout - Visual differentiation must be obvious within seconds - One cohesive palette with dominant and accent colors ## Implementation Requirements - Production-grade, functional code - Framework-appropriate patterns (React, Vue, HTML/CSS/JS) - CSS variables for theme consistency - Motion used intentionally, not decoratively ## Visual Techniques (Use When Appropriate) - Asymmetry and grid-breaking layouts - Controlled density or deliberate negative space - Gradient meshes, noise, grain, or texture - Layering, depth, and atmospheric backgrounds ## Explicit Prohibitions - Generic component libraries without customization - Predictable layouts and color schemes - Cookie-cutter landing-page aesthetics
Imported from the listed AgentSkill.sh category. Complete supplied package files and notices are retained. Required external tools and credentials are not installed. No bundled code was executed during import. Individual agent task behavior has not been tested.