Frontend skills

This skill helps you write robust Playwright E2E tests using Page Object Model, precise selectors, and MCP-guided exploration.

This skill helps you style Tailwind 4 patterns with cn() safely, avoiding var() in className and hex colors.

This skill automates web navigation, form filling, and data extraction using browser interactions to boost testing and data gathering efficiency.

This skill crafts distinctive, production-grade frontend interfaces with bold aesthetics, delivering polished components, pages, or apps that avoid generic AI

This skill helps you create, edit, and share Proof markdown documents via web API or local bridge, enabling seamless collaboration.

This skill runs end-to-end browser tests on pages affected by a PR or branch using the agent-browser CLI.

This skill performs a comprehensive audit of accessibility, performance, theming, and responsive design, producing a prioritized issue report with actionable

This skill helps normalize a feature to the design system by aligning typography, colors, spacing, components, and accessibility.

This skill strategically colorizes monochromatic designs to improve hierarchy, meaning, and engagement while respecting brand and accessibility.

This skill helps you apply quiet design principles to reduce visual intensity while preserving impact and usability across interfaces.

This skill analyzes and refactors layouts to create intentional rhythm, improving spacing, hierarchy, and visual balance for polished interfaces.

This skill helps you design and implement distinctive production-grade frontend interfaces with polished aesthetics and creative detail.

This skill helps you adapt designs to work across mobile, tablet, and desktop, ensuring consistent experiences across contexts and devices.

This skill amplifies safe designs by applying distinctive typography, color, and layout choices to create memorable, usable experiences.

This skill evaluates interface design from a UX perspective, delivering actionable feedback on hierarchy, architecture, emotion, and overall quality.

This skill helps identify and extract reusable components, tokens, and patterns from your design system to enable systematic reuse.

This skill helps you push interfaces beyond conventional limits by applying extraordinary frontend techniques that wow users.

This skill helps you inject moments of joy and personality into interfaces, turning functional flows into memorable, delightful experiences that feel

This skill helps simplify designs by stripping complexity to reveal the essential elements, accelerating clarity and user focus.

This skill analyzes typography and delivers a systematic plan to improve font choice, hierarchy, sizing, and readability for clearer, more intentional text.

This skill helps you create high-quality 3D scenes and interactive visuals using Three.js with CDN-r128 best practices.