ui-kit-generator

Atomic Design methodology for React component architecture. Use for structuring component libraries, organizing UI hierarchies, and creating scalable design systems. Triggers on requests for component organization, design system structure, UI hierarchy, or questions about Atoms/Molecules/Organisms/Templates/Pages.

Design tokens system using CSS Custom Properties for consistent styling. Use for creating color palettes, spacing scales, typography systems, and theming (dark/light mode). Triggers on requests for design tokens, CSS variables, theming, color systems, spacing scales, or consistent styling.

Modern React 19 with TypeScript development. Use for creating React components, hooks, context providers, and applications with strict TypeScript typing. Triggers on requests for React components, functional components, hooks, state management, event handling, or TypeScript interfaces/types for React.

Storybook 8 for React component documentation and testing. Use for creating stories, documenting components with Controls/Actions, visual testing, and MDX documentation. Triggers on requests for Storybook stories, component documentation, visual testing, or interactive component demos.

````markdown