What problem does it solve? Redesigning an existing UI in a different visual style normally means manually rewriting every color, radius, shadow, and motion token. This Skill automates that reskin: it takes an existing design's token bundle and produces a new bundle in a target visual vocabulary, plus a render-test page proving the result is coherent. ## Core Features & Use Cases - Named-vocabulary remix: Swap an existing design into a catalogue style (Swiss, Brutalist, Art Deco, Cyberpunk, Soft UI, Editorial, and more) while preserving brand-identity tokens like logo colors and wordmark fonts. - OKLCH hue rotation: Rotate an entire palette around a new brand primary color while preserving lightness and chroma ramps, with automatic gamut clamping and post-rotation WCAG-AA contrast checks. - Invariant and contrast reporting: Emit a report listing preserved brand tokens, preset "breaks-if" violations, gamut clamps, and contrast regressions instead of silently shipping a broken palette. - Use Case: You extracted tokens from a competitor's site and want to see your own brand rendered in a Swiss style with your orange primary — the Skill merges the preset structure, rotates the hue, and outputs CSS, JSON, a render-test HTML page, and a report. ## Quick Start Remix the extracted design tokens in DESIGN.md into the Brutalist preset and generate the render-test page.
