component-builder

Describe your component's name, props, and visual requirements, and this Skill scaffolds a production-ready React component using MUI primitives and M3 design tokens with TypeScript typing, accessibility compliance, and token-based styling via CSS variables.

Yes. This Skill generates token-aware React components that leverage MUI and CSS variables for styling, ensuring consistent design system compliance and graceful fallback handling when tokens are missing.

This Skill generates fully typed, accessible React components using MUI as the foundation, enforcing TypeScript best practices with named props, built-in ARIA support, and edge-case handling for loading, empty states, and errors.

Use M3-compliant component scaffolding that applies design tokens, MUI primitives, and strict accessibility standards. This Skill generates self-contained components ready for production with token references and fallback guidance.

No. This Skill automates token-based styling through sx and CSS variables, handles missing tokens with console warnings and fallbacks, and integrates token references directly into generated components.

Generated components include built-in edge-case handling for loading, empty data, and error states, plus accessibility enforcement and graceful fallback guidance when design tokens are unavailable.