The Frontend Engineering Skill for Coding Agents.
Transform your AI coding assistant into a principal frontend engineer. One universal command. Zero generic AI slop.
Works with every coding agent.
One universal CLI compiles the 8 skills into the exact native configuration format required by your preferred AI assistant.
--claudeClaude Code
Full orchestrator integration with automated tool invocation and lifecycle stages.
.claude/skills/ + CLAUDE.md--cursorCursor Rules 2.0
Scoped glob patterns, deterministic context rules, and architectural prompts.
.cursor/rules/*.mdc--antigravityGoogle Antigravity
Full dual-mode lifecycle with multi-agent subagent delegation and tools.
.agents/skills/*--windsurfWindsurf Cascade
Deep workspace awareness with proactive architectural constraints.
.windsurf/rules/*.md--copilotGitHub Copilot
Persistent context and conversion guidelines loaded for every code generation.
.github/copilot-instructions.mdMost AI-generated web interfaces look identical because they lack taste engineering, spatial restraint, and conversion discipline.
No Cookie-Cutter Layouts
Projects receive assigned layout archetypes and font pairings derived from deterministic seed math, guaranteeing bespoke personality.
Generous White Space
Strict limits on headline line counts (2-Line Iron Rule), 20-word subtext maximums, and double-bezel concentric radii math.
Engineered for Conversion
Social proof, verified numbers, and micro-interactions placed directly adjacent to decision triggers, not hidden on secondary pages.
Pick the right skill for the job.
irfanlovefront
Master 5-Stage Lifecycle OrchestratorCoordinates the entire 5-stage frontend lifecycle end-to-end. Evaluates deterministic entropy, dispatches specialized agents in sequence, and enforces architectural cohesion across all layers.
taste-design-engineer
Pre-Architecture Taste & Design BriefIngests platform targets, routes, and user sketches. Formulates human-grade aesthetic briefs, Apple fluid interface physics, and conversion foundations before scaffolding code.
frontend-architect
Foundations, Design Tokens & Brand VectorArchitects design tokens, fluid clamp typography, container-constrained vector BrandLogo, dynamic retina favicons, Lenis smooth scrolling, and repository state tracking.
creative-layout-engineer
Macro-Layout & Anti-Slop Hero SectionCrafts persistent single-line navigation, bespoke Hero sections meeting the 2-Line Iron Limit, asymmetric editorial splits, and gapless bento grid shells with grid-flow-dense.
interactive-component-engineer
UI Primitives & Motion ChoreographyBuilds downstream interactive sections, double-bezel card enclosures, point-of-doubt social proof triggers, 44px touch targets, and GSAP/Motion spring choreographies.
experience-qa-auditor
QA Pre-Flight, 320px Mobile & Technical SEOExecutes the 45+ Pre-Flight Check. Audits responsiveness from 320px to 1440px, verifies WCAG AA contrast (>= 4.5:1), injects JSON-LD schemas, and generates custom 404/error pages.
build-error-resolver
Build & TypeScript Error ResolutionSpecialized rapid-recovery engineer for build breakages, package mismatch, and TypeScript errors. Fixes compile errors with surgical diffs and zero architectural bloat.
github-readme-writer
Daytona Open-Source Technical DocsProduces technical documentation and GitHub READMEs following the Daytona open-source framework: Impactful Header, Visual Feast, Project Hygiene, and zero AI cliches.
What is new in Release 2.0.
From an experimental set of local skills to a universal, cross-platform engineering suite with codified conversion foundations.
| Capability | Release 1.0.0 | Release 2.0.0 (New) |
|---|---|---|
| Distribution & Installation | xManual repo clone and manual directory copying | Universal one-command terminal installer (npx irfanlovefront) |
| Pre-Architecture Stage 0 | xCode scaffolding started immediately without aesthetic brief | Dedicated /taste-design-engineer consultation before code |
| Conversion & Visual Hierarchy | xAd-hoc layout suggestions without codified rules | The 7 Conversion Foundations hardcoded across all 5 stages |
| Cross-Agent Transpilation | xAntigravity and Claude specific markdown formats | Native export to Claude, Cursor (.mdc), Windsurf, Copilot, Antigravity |
| Lifecycle Coordination | x4 independent uncoordinated stages | Unified 5-stage lifecycle governed by master orchestrator |
Built with irfanlovefront.
Explore 12 completely autonomous, domain-specific website categories engineered using the 5-stage lifecycle and zero generic templates.
E-Commerce
Online stores selling physical or digital goods with categorized catalogs, shopping cart flow, and instant checkout signals.
Business & Corporate
Strategic corporate front sharing capabilities, mission, team leadership, service menus, and stakeholder trust metrics.
Blog & Content
Publishing platform focused on well-crafted articles, guides, and topical analysis with distraction-free reading typography.
Portfolio
Immersive gallery displaying selected case studies, interactive prototypes, and design artifacts to attract premium clients.
Educational & E-Learning
Comprehensive education hub delivering interactive workshops, structured learning tracks, and student milestones.
Nonprofit & Cause
Mission-first platform highlighting real-world social impact, donation tiers, field reports, and community support.
Event & Conference
Specialized event landing page managing agenda timelines, venue directions, ticket passes, and attendee RSVPs.
Membership & Community
Interactive forum and subscriber community supporting nested comments, karma badges, and channel hubs.
Directory & Listings
Searchable directory indexing regional business services, developer tools, or niche products with community reviews.
Personal & Dossier
Individual online residence documenting philosophy, open-source projects, book notes, and personal contact dispatch.
News & Magazine
High-frequency publishing portal with headline ranking, topical editorial sections, breaking alerts, and opinion columns.
Landing Page
Single-scroll campaign page dedicated to driving a singular action with social proof, interactive demo, and FAQ accordion.
Propose a new specialized skill.
Have a specialized frontend workflow, 3D Canvas pipeline, or custom framework transpiler? Submit your architecture proposal directly to the irfanlovefront ecosystem.
Frequently answered questions.
Direct, authoritative technical answers to common questions about installation, lifecycle governance, and AI agent transpilation.
A new standard for your AI coding assistants.
Equip your AI assistants with principal-level engineering rules, Apple WWDC fluid interface physics, and conversion design foundations with a single terminal command.