UI Component Variant Generator
Generates multiple production-grade design variants of UI components along a clear structural or visual axis for rapid in-browser comparison.
The UI Component Variant Generator skill helps developers and designers iterate rapidly by building three distinct, fully accessible versions of a single UI piece directly inside the target application. Rather than offering trivial color swaps, it varies components along intentional design axes—such as structure, density, typography, emphasis, or voice—while enforcing strict accessibility standards. Variants are injected via an interactive, URL-driven switcher in the real production environment, allowing teams to test real-world trade-offs with realistic data before promoting the winning variant and cleanly removing all temporary harness code.