Frontend skills

This skill helps you implement fault-tolerant web audio with zero-lag playback and responsive sound effects across pages.

This skill helps you implement type-safe form validation and API contracts using Zod, with automatic errors and runtime checks.

This skill automates visual regression snapshot testing to detect styling changes across components during CI/CD.

This skill helps optimize React event handling by leveraging synthetic event internals to improve delegation, custom events, and high-frequency listeners.

This skill translates technical documents, code comments, and UI strings across languages while preserving code blocks and terminology to accelerate

This skill helps you implement a fluid Utopia spacing system with container-query aware tokens to create consistent, responsive layouts.

This skill guides rigorous performance profiling for large React apps, delivering root-cause artifacts and measurable p95/p99 render-time improvements.

This skill helps you design and integrate a contenteditable editor with custom data models, ensuring safe HTML, cross-browser selection, and basic formatting.

This skill defines a zero query, attribute driven web components architecture using declarative shadow DOM and handleEvent patterns with pure browser APIs.

This skill helps you orchestrate concurrent rendering in React 18 using useTransition and Suspense to preserve responsiveness during heavy workloads.

This skill analyzes coding requests and coordinates the best specialist agents to write, debug, or refactor code efficiently.

This skill suggests refactoring opportunities to improve code structure, readability, and maintainability across methods, conditionals, and design patterns.

This skill helps you design deterministic UI flows with finite state machines, improving reliability, visualization, and validation across complex interactions.

This skill helps you design and optimize immersive 3D web experiences using Three.js, React Three Fiber, and WebGL for performant, engaging sites.

This skill generates standardized front-end pages based on Anatomy guidelines, prompting mode selection (unsupervised or supervised) and assembling Wrapper,

This skill models UI updates as atomic transactions to ensure consistency across complex interactions and state changes.

This skill helps maintain UI consistency during network partitions by enabling offline-first workflows, reconciliation, and graceful degradation.

This skill helps you build browser-based audio apps with Tone.js, enabling synthesis, scheduling, effects, and real-time audio with precision.

This skill helps you create and manipulate Pencil .pen designs, read and modify components, and generate code from designs.

This skill identifies components that directly use trpc or react-query hooks and guides replacing them with refine hooks for consistent data access.

This skill helps you implement deep instrumentation pipelines for tracing, metrics, and real-user monitoring in React apps.