Summary
This is the bridge you need when you're adopting Material 3, migrating from Chakra to shadcn/ui, or trying to theme Radix primitives with your own tokens. It walks through a six-axis crosswalk (color roles, type scale, spacing, radius, elevation, motion) using curated mappings for the major systems or deriving one on the fly for others. The three directions are useful: map an external system into your tokens to adopt their look, theme their components with your primitives, or build a bridge layer for a full migration. The contrast verification step against all eight states plus dark mode is the kind of detail that saves you from shipping inaccessible color pairs. Outputs a crosswalk table and verified token overrides ready to wire up.
Install to Claude Code
npx -y skills add plugin87/ux-ui-agent-skills --skill migrate-design-system --agent claude-codeInstalls into .claude/skills of the current project.
Agent, run crypto. Access onchain data & trade routes via 1inch.
Install now →
On Capafy, your Skill runs online 24/7 as an agent product, and you get paid every time someone uses it.
Start earning →
An agent that runs the SEO playbooks that move rankings and ships PRs you control.
Get founding access →
Connect Claude to +800M contacts, +150M companies. Find & Enrich leads in chat.
Try For Free →Files
SKILL.md
Select a file.
Featured
Agent, run crypto. Access onchain data & trade routes via 1inch.
Install now →On Capafy, your Skill runs online 24/7 as an agent product, and you get paid every time someone uses it.
Start earning →An agent that runs the SEO playbooks that move rankings and ships PRs you control.
Get founding access →Connect Claude to +800M contacts, +150M companies. Find & Enrich leads in chat.
Try For Free →First SeenJun 11, 2026
