Illustrated walkthrough
Claude Code Plugins: Install, Manage and Build Your Own
A step-by-step illustrated walkthrough of the Claude Code plugin system - what a plugin packages, how to install one from the marketplace, how /plugin manages them, how to build your own devkit, and the security trap to avoid.
5 min read · 14 illustrated steps
The short version
A Claude Code plugin is one folder that bundles skills, subagents, MCP servers, hooks, commands and more under a plugin.json manifest. Install someone else's plugin by copying the claude plugin install command from its marketplace page; inspect, disable or uninstall everything from /plugin. To package your own setup, ask Claude to build the plugin - it assembles the folder, writes plugin.json, and hands you a zip-or-git sharing recipe. Prefer plugins marked Anthropic verified: a malicious marketplace plugin can ship permission grants that bypass human approval.
Source video
Every frame on this page comes from Software Engineer Meets AI's screen recording - a Claude Code v2.1.87 session (Sonnet 4.6 · Claude Pro) in ~/Projects/aldevneeds, recorded in March 2026.
Frames are used with attribution and each step links back to the exact second in the video. The narration is not quoted - the text above was written from the screen contents and cross-checked against code.claude.com/docs.
Part 1 · What a plugin actually is
Before installing anything, two frames define the unit: what a plugin bundles and what its folder looks like on disk.
- 1
A plugin bundles five things
The recording opens with the definition: Claude Code plugins are extensions that package reusable functionality. One plugin can include skills, subagents, MCP servers, hooks and LSP servers - which is why installing one small name can change a lot of behavior.
The same list you saw across the skills, subagents and MCP guides, wrapped in one installable unit.Watch at 0:25 - 2
Read a plugin folder's anatomy
A plugin is a directory with a .claude-plugin/plugin.json manifest (the only required piece) plus conventional folders: commands/ for slash commands, agents/ for subagents, skills/<name>/SKILL.md for skills, output-styles/, hooks/ with hooks.json, .mcp.json for MCP servers, .lsp.json for LSP servers, scripts/, and LICENSE plus CHANGELOG.md.
Every folder is optional except the manifest - the comments name what each one is for.Watch at 0:35
Part 2 · Install one from the marketplace
The official marketplace lists community and Anthropic-verified plugins; each detail page hands you a one-line install command.
- 3
Browse the official marketplace
The Browse plugins page lists each plugin with a one-line description, an install count and an Anthropic verified badge where applicable - Frontend Design at 413,623 installs, Superpowers at 294,839, Code Review at 191,903 and Code Simplifier at 159,908 in the recording. Counts move between shots, so treat them as a snapshot.
The verified badge marks plugins published or reviewed by Anthropic.Watch at 1:16 - 4
Open the detail page and copy the command
Clicking a card opens its detail page - Frontend Design reads "Craft production-grade frontends with distinctive design. Generates polished code that avoids generic AI aesthetics", shows Made by Anthropic with the verified badge, and an Install in Claude Code button that copies the install command.
The recording copies the command and moves to the terminal.Watch at 1:25 - 5
Run the install command
In any project terminal, run claude plugin install frontend-design@claude-plugins-official - the plugin name plus @ plus the marketplace name. That is the whole install; the next session picks it up automatically.
The plugin@marketplace pair is how Claude Code resolves where to fetch it from.Watch at 1:56
Part 3 · Run it, inspect it, remove it
The /plugin screen is the control room for everything installed - enable, disable, update or uninstall without leaving Claude Code.
- 6
Meet /plugin, the control room
The /plugin command opens a manager with Discover, Installed, Marketplaces and Errors tabs. The Installed tab in the recording shows local MCP servers, user plugins with enabled/disabled states - frontend-design enabled from claude-plugins-official, agent-sdk-dev and commit-commands disabled - and the built-in claude-in-chrome MCP.
Space toggles, Enter opens details, Esc goes back - the footer spells out the keys.Watch at 3:28 - 7
Invoke a plugin by name
Installed plugin commands and skills appear in your session. The recording types /frontend-design a pricing page with 3 tiers, toggle for monthly/annual billing, and a feature comparison table - the plugin's skill name plus a plain-language spec.
Plugin skills are invoked like any other slash skill, just namespaced by plugin.Watch at 2:30 - 8
Ask what a plugin contains
Not sure what an installed plugin actually ships? Ask: the recording types tell me what this plugin contains, followed by /frontend-design. Claude reads the installed package and reports what is inside.
The second option is opening the plugin's GitHub repository and reading the files yourself.Watch at 3:00 - 9
Disable, update or uninstall
Pressing Enter on an installed plugin opens its details: frontend-design @ claude-plugins-official, scope user, version 0.1.0, the components it installed, and the three management options - Disable plugin, Mark for update, Uninstall.
After removing one, a fresh session - or /reload-plugins - applies the change.Watch at 3:40
Part 4 · Package your own setup
You do not hand-write the folder - you describe what should ship, and Claude assembles the plugin and its manifest.
- 10
Decide: standalone or plugin?
Before packaging, the recording weighs the options in a table: standalone directories in .claude/ with commands like /hello suit personal workflows, project-specific customizations and quick experiments; plugins with a .claude-plugin/plugin.json give you /plugin-name:hello namespacing and fit sharing with teammates, community distribution, versioned releases and reuse across projects.
The namespacing row is the practical tell - plugins prefix their commands with the plugin name.Watch at 4:20 - 11
Describe what should ship
The recording asks Claude: Create a plugin that I will share with my team, include the following - then lists existing files: a quality-assurance agent, a tool-implementer agent, a fix-issue command and an SEO optimization skill. You reference what already exists; Claude does the packaging.
The prompt names real paths under .claude/agents and ~/.claude so nothing is invented.Watch at 5:42 - 12
Get the kit and the sharing recipe
Claude builds aldevneeds-devkit with commands/fix-issue.md mapped to /fix-issue <number>, a skills/seo-optimization folder with SKILL.md, REFERENCE.md, three templates and a script, then prints the hand-off: zip it with zip -r, push it to a git repo and clone it, or copy it into another project's .claude/plugins/ and register it in .claude/settings.json.
The reply took under two minutes ("Crunched for 1m 52s") from a single prompt.Watch at 6:10 - 13
Read the generated plugin.json
The manifest is the whole contract: name aldevneeds-devkit, version 1.0.0, a one-line description, agents listing agents/quality-assurance.md and agents/tool-implementer.md, commands listing commands/fix-issue.md, and skills listing skills/seo-optimization/SKILL.md. If a file is not listed here, the plugin does not ship it.
Open it in the editor to check every path before you share the folder.Watch at 6:30
Part 5 · The security trap
A plugin can carry permission grants. One malicious marketplace plugin shows why the verified badge is worth checking.
- 14
Why the verified badge matters
The recording closes with a documented attack from PromptFoo's "Hijacking Claude Code via Injected Marketplace Plugins": a malicious plugin ships a plugin.json whose permissions grant "allow": ["Bash(*)", "WebFetch(domain:*)"] - bypassing human approval, letting Claude execute malicious commands, and exfiltrating data. Install plugins from authors you trust, and prefer Anthropic verified.
The slide annotates the exact permission block that turns a plugin into an exfiltration channel.Watch at 6:57