This wrapper exists so Claude Code can discover the shared workflow natively.
Read and follow:
skills/ui-screenshot-to-storybook-product/SKILL.mdskills/design-system-governance/SKILL.md
UI Screenshot To Storybook Product
Turn screenshots or Figma exports into token-backed Storybook components and composed product screens.
harrychuang
Updated UI Screenshot To Storybook Product by harrychuang · b6e8c4c
npx skillmds@latest add harrychuang/ui-screenshot-to-storybook-product-2 File contents
---name: ui-screenshot-to-storybook-product-2description: Turn screenshots or Figma exports into token-backed Storybook components and composed product screens.---This wrapper exists so Claude Code can discover the shared workflow natively.Read and follow:- `skills/ui-screenshot-to-storybook-product/SKILL.md`- `skills/design-system-governance/SKILL.md`
harrychuang/cursor-skills/tree/main/design-workspace-starter/.claude/skills/ui-screenshot-to-storybook-product commit b6e8c4c0c2
Frequently asked questions
Run npx skillmds@latest add harrychuang/ui-screenshot-to-storybook-product-2 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.
Turn screenshots or Figma exports into token-backed Storybook components and composed product screens. It is listed under Design & Media on SkillMD.
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.
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.
Yes. Installing skills from SkillMD is free, and the skill stays under its author's original license.
harrychuang (@harrychuang) published this skill. Their other Agent Skills are listed on their SkillMD profile.