frontend-perfection

# frontend-perfection Audit and polish a frontend — static HTML/CSS/JS or a built SPA — towards verifiable perfection. The skill exists because production web perf tooling commonly breaks when it pokes at private APIs (Playwright internals, old Lighthouse signatures, unisolated global deps). This skill runs on STABLE apis only, computes exactly (luminance, not eyeballs), and demands a before/after report bound to audit ids. ## When to use - User asks to "make the layout perfect", "fix performance", "reach 100/100/100/100", "check the frontend", "audit the page". - User wants an OG image or social share meta for a homepage. - User reports contrast problems, missing SEO tags, broken anchors under a fixed header, colors duplicated as raw hex. ## Composition - For Core Web Vitals / schema.org / SEO deep-dives — load `seo-toolkit` (this skill measures layout, contrast, tokens and a11y; the SEO-layer breadth lives there). - For a distinctive visual DIRECTION before building — load `frontend-design-taste` (palette/type/signature), then run this skill to verify the result. ## Workflow 1. **Locate the project** — static files (index.html + css/) or built SPA. 2. **Serve it locally** if needed: `python3 -m http.server 8377` (or the project's dev server). Static files are fine over http://localhost. 3. **Run audit.js** (Lighthouse, real Chrome): ```bash node scripts/audit.js --url http://localhost:8377/ --mobile --out lh-mobile.json node scripts/audit.js --url...