paths:
- "framework/agents/frontend/**"
Frontend Agent Rules
Design System Rules
The brique agent (15-frontend/01-brique.md) uses design rules for pixel-perfect Figma to shadcn/ui conversion.
Setup: /figma:create-design-system-rules generates .figma/design-system-rules.json
Workflow:
- Phase 0: Auto-detect stack (React/Next.js or Vue/Nuxt) + load design rules
- Phase 1-3: Convert with exact token mapping
- Output: Framework-adapted code (95-100% fidelity with rules, ~70-80% without)
Documentation: agents/frontend/design-system/README.md
Schema: schemas/figma-design-system-rules.schema.json
Frontend Agents
| Agent | File | Purpose |
|---|---|---|
| Orchestrateur | 00-orchestrateur.md | Coordinates all frontend agents |
| Brique | 01-brique.md | Figma/HTML to shadcn/ui (adaptive) |
| Frontend QA | 02-frontend-qa.md | 3 modes: full, landing, shadcn |
| Visual Auditor | 03-visual-auditor.md | Chrome DevTools screenshots/analysis |
| Backoffice | 04-backoffice-auditor.md | Next.js + Shadcn consistency |
| SVG Analyzer | 05-svg-analyzer.md | Component inventory + SVG |
| Pencil | 06-pencil-generator.md | Next.js to .pen files |
| Shadcn Migrator | 07-shadcn-migrator.md | Migration plan to pure shadcn/ui |
Plugin Marketplace
| Plugin | Install | Usage |
|---|---|---|
ui-ux-pro-max-skill | /plugin marketplace add nextlevelbuilder/ui-ux-pro-max-skill | Lookup palettes (161), font pairings (57), UX guidelines (99), chart types (25) par industrie/stack — complémentaire à /hue (génération) |
Checklists
Reference checklists in 15-frontend/checklists/:
- UX, UI, Tailwind, shadcn, code quality