How do I install the Migrate Design System skill?

Run npx skillmds@latest add zereight/migrate-design-system in your terminal (requires Node.js), paste this page's agent-chat prompt into Claude, Cursor, or any MCP-connected agent, or download the SKILL.md file and copy it into your agent's skills directory.

Is Migrate Design System safe to use?

This skill has not completed SkillMD's automated safety review yet. SkillMD never runs a skill's scripts for you; review the SKILL.md before installing.

Which AI agents work with Migrate Design System?

This skill is tagged as working with Claude Code, Claude.ai, OpenAI Codex. SKILL.md is an open format, so most agents that read a skills directory can load it too.

Is Migrate Design System free to use?

Yes. Installing skills from SkillMD is free, and the skill stays under its author's original license.

Who published Migrate Design System?

zereight (@zereight) published this skill. Their other Agent Skills are listed on their SkillMD profile.

Migrate Design System by zereight — Agent Skill

Name: Migrate Design System
Author: zereight

Migrate Design System

Map this token system to or from any external design system (Material Design 3, Apple HIG, Fluent, Carbon, Ant, shadcn/ui, Radix, Chakra, Mantine, Bootstrap…) — adopt their look, build on their stack, or migrate between systems. Use when the user mentions interop, migration, or a specific design-system/component-library bridge.

zereight 6cc55dd 1.8 KB Updated Sep 17, 2026

File contents

Skill: Migrate / Interop Design System

Bridge to or from external design systems via a role-based crosswalk.

Steps

Read design-systems/interop-protocol.md (Crosswalk Method, the three directions, headless-vs-styled guidance, verification).
Use the curated tables in design-systems/crosswalk.md for Material 3 / Apple HIG / Fluent 2 / Carbon / shadcn/ui / Radix. For others, derive a mapping with the Crosswalk Method (map by role/intent across 6 axes: color roles, type scale, spacing unit, radius, elevation, motion).
Choose the direction:
- FROM external → our tokens (adopt their look): re-point semantic.*.
- TO external stack (our components on their foundation): theme their primitives with our tokens.
- Migrate: Audit → Map → Bridge (alias layer) → Verify, screen by screen.
Verify every mapped color pair for contrast (scripts/contrast.py / a11y-audit); confirm all 8 states + dark mode survive the mapping.

Output

A crosswalk table (our token → their token → value note), a bridge plan if migrating, and verified token overrides. Render via design-code.

Kit location

This skill is part of ux-ui-agent-skills v2.4.0.

Resolve every relative path in the steps above against:

.agents/ux-ui-agent-skills/

(from repo root: /Users/tao.exe/Documents/skill/.agents/ux-ui-agent-skills)

Load .agents/ux-ui-agent-skills/CLAUDE.md when you need the full agent persona or Request Router.

Frequently asked questions