magicpath — Claude Code plugin: MagicPath UI components
Lets Claude search, preview, install and export MagicPath UI components through the magicpath-ai CLI. Handy when a component has to land in your local code.
/plugin marketplace add anthropics/claude-plugins-community
/plugin install magicpath@claude-communityWhat magicpath does
The plugin wires the agent to MagicPath components. You can look one up, see it before committing, pull it into a folder, or build and edit one on the canvas. Everything runs through the magicpath-ai CLI from inside a Claude session.
The skill shipped here is called magicpath. It also tells the agent how to keep a design faithful one to one when it moves from MagicPath into local code. A second part covers MagicPath-hosted skills: create, fetch, update, import, delete, all via magicpath-ai skills ....
If the magicpath-ai command is not on your machine, nothing will fire. Check that first. The repo is the single source for these skills, so the plugin and npx skills add bring you the same thing.
What it helps with
- find a matching UI component in MagicPath without leaving the editor
- preview a component before pulling it into a project
- export a component to a folder and wire it into local code
- move a MagicPath design into code without losing fidelity
- create or edit a component on the MagicPath canvas
Example prompts for the agent
- Find a product card component in MagicPath and show me what it looks like
- Export that component into
componentsand hook it up in the project - Create a search field component on the MagicPath canvas
How to install magicpath
Plugin marketplace
/plugin marketplace add anthropics/claude-plugins-community/plugin install magicpath@claude-communityStep by step, with commands for each platform: Claude Code plugins: marketplaces, installing, and building your own
From the same set2
Similar
Nearby in Frontend and UI
All plugins for Frontend and UI →Questions about magicpath
How do I install magicpath in Claude Code?
Add the marketplace with /plugin marketplace add anthropics/claude-plugins-community, then install the plugin with /plugin install magicpath@claude-community.
What does the magicpath plugin do?
It gives the agent a magicpath skill for searching, previewing, installing, exporting, creating and editing MagicPath UI components through the magicpath-ai CLI, plus managing MagicPath-hosted skills.
How is the plugin different from installing with npx skills add?
Both pull from the same repository — npx skills add and magicpath-ai setup-skills install the skills from there. The Claude plugin gives you the same magicpath skill.