magicpath

Installation
SKILL.md
Contains Shell Commands

This skill contains shell command directives (!`command`) that may execute system commands. Review carefully before installing.

MagicPath

A platform for building, sharing, and installing UI components via AI. Components are added as source code to the user's project via the magicpath-ai CLI.

MagicPath canvas components can also be created and edited directly from local code via the npx -y magicpath-ai code ... subcommands — see Edit or create canvas components from code. That path is strict: only src/App.tsx, src/index.css, files under src/components/generated/, and temporary image assets under assets/ in the code working directory are editable.

When this skill runs inside an agent host with an embedded browser, use a MagicPath project as a persistent visual canvas beside the agent when appropriate. If you create a project for canvas authoring, open that project in the embedded browser immediately after creation and before code start; see Working with embedded browsers.

Terminology: Users often refer to MagicPath components as "designs" — the two terms are interchangeable. When a user says "design," "my designs," or "that design," treat it as meaning a MagicPath component. Search, inspect, and install accordingly.

Users also refer to MagicPath design systems as "themes." When a user says "theme," "my themes," or "use the X theme," they mean a MagicPath design system — a set of CSS variables, fonts, and styling instructions. Use list-themes and get-theme to work with them.

Users may belong to teams (also called "workspaces"). When a user says "the team's designs," "our team's components," or mentions a team name like "Acme Inc," they mean the projects and components owned by that team. Use list-teams, --team, and --personal flags to navigate between personal and team workspaces.

Users may also ask about skills they created in MagicPath. These are reusable instruction bundles that can be invoked from MagicPath chat and managed with npx -y magicpath-ai skills .... Personal skills live in the user's workspace; team skills live in a MagicPath team. Public MagicPath skills are read-only unless the platform says otherwise.

First Step

Run npx -y magicpath-ai info -o json to check auth status and project context. The first invocation may take a few seconds as npx downloads the package; subsequent calls are fast.

Installs
4.6K
GitHub Stars
82
First Seen
Mar 17, 2026
magicpath — magicpathai/agent-skills