Claude Code skills are reusable instruction files that teach AI agents how to handle specific tasks, enforce coding standards, and automate complex workflows. Each skill lives in a SKILL.md file that Claude loads on demand — giving you a way to encode your team’s best practices into something the agent can actually use, session after session.
Since launching in late 2025, the Claude Code skills ecosystem has exploded. The official anthropics/skills repository has crossed 87,000 GitHub stars. Community marketplaces list over 700,000 agent skills. And the search volume for “claude code skills” went from zero to over 22,000 monthly searches in under six months.
This guide covers everything: what skills are, the best ones to install today, how to build your own, and how they fit alongside MCP servers, agents, and hooks. We’ll also show how skills and MCP servers work together using AIDesigner’s design-to-code workflow as a real example.
What Are Claude Code Skills?
Claude Code skills are markdown files (named SKILL.md) that contain instructions Claude follows when performing specific tasks. Think of them as onboarding documents for an AI agent — they tell Claude your coding conventions, preferred workflows, and domain-specific knowledge so you don’t have to repeat yourself every session.
A skill can be as simple as a style guide (“always use Tailwind, never inline styles”) or as complex as a multi-step deployment pipeline with dynamic context injection, subagent orchestration, and scoped hooks.
Skills follow the Agent Skills open standard, which means a SKILL.md file written for Claude Code also works in Cursor, GitHub Copilot, Codex CLI, Gemini CLI, and other compatible agents.
How Skills Differ from CLAUDE.md
Your CLAUDE.md file loads into context every session, regardless of what you’re doing. Skills load only when relevant — either when you invoke them with /skill-name or when Claude determines they match the current task based on the skill’s description.
This matters because context window space is finite. Putting everything in CLAUDE.md burns tokens on instructions that may not apply. Skills let you keep specialized knowledge available without the constant cost.
Where Skills Live
| Scope | Path | When to use |
|---|---|---|
| Project | .claude/skills/<name>/SKILL.md | Team-shared standards for this repo |
| Personal | ~/.claude/skills/<name>/SKILL.md | Your preferences across all projects |
| Plugin | <plugin>/skills/<name>/SKILL.md | Distributable packages |
| Enterprise | Managed settings | Org-wide policies |
When skills share the same name across levels, higher-priority locations win: enterprise > personal > project. Plugin skills use the plugin-name:skill-name namespace to avoid conflicts.
The SKILL.md File Format
Every skill has two parts: YAML frontmatter that tells Claude when and how to use the skill, and markdown content with the actual instructions.
Here’s a minimal example:
---
name: api-conventions
description: Enforce API route conventions. Use when creating or modifying API endpoints.
---
## API Route Conventions
- Use Zod for request validation with @hono/zod-validator
- Return consistent response shapes: { success: boolean, data?: T, error?: string }
- Keep routes thin — business logic goes in services
- All endpoints require authentication unless explicitly marked public
And here’s a more advanced skill with dynamic context, subagent execution, and scoped hooks:
---
name: pr-review
description: Review pull requests for quality. Use when asked to review a PR or check code changes.
context: fork
agent: Explore
allowed-tools: Read, Grep, Glob, Bash
hooks:
PreToolUse:
- matcher: "Bash"
hooks:
- type: command
command: "./scripts/validate-safe-command.sh"
---
## Pull Request Context
- PR diff: !`gh pr diff`
- PR comments: !`gh pr view --comments`
## Review Checklist
1. Check for security vulnerabilities (SQL injection, XSS, command injection)
2. Verify error handling at system boundaries
3. Confirm tests cover new behavior
4. Flag any breaking API changes
Complete Frontmatter Reference
| Field | Required | What it does |
|---|---|---|
name | No | Display name and slash-command trigger. Defaults to directory name. |
description | Recommended | Tells Claude when to use this skill. Front-load the key use case — truncated at 250 characters. |
disable-model-invocation | No | Set true to prevent Claude from auto-loading. Only you can invoke it. |
user-invocable | No | Set false to hide from the / menu. Use for background knowledge skills. |
allowed-tools | No | Restrict which tools Claude can use when the skill is active. |
context | No | Set fork to run in an isolated subagent context. |
agent | No | Which subagent type when context: fork (e.g., Explore, Plan, general-purpose). |
model | No | Override the model (sonnet, opus, haiku). |
effort | No | Set thinking effort: low, medium, high, max. |
paths | No | Glob patterns limiting when the skill activates (e.g., "src/api/**/*.ts"). |
hooks | No | Lifecycle hooks scoped to this skill only. |
argument-hint | No | Hint shown during autocomplete (e.g., [issue-number]). |
shell | No | bash (default) or powershell. |
Dynamic Context Injection
The !`command` syntax runs shell commands before the skill loads, injecting fresh data into the prompt:
## Current Branch State
- Branch: !`git branch --show-current`
- Recent commits: !`git log --oneline -5`
- Uncommitted changes: !`git diff --stat`
This is powerful for skills that need real-time context — PR reviews, deployment checklists, or environment-aware configurations.
String Substitutions
| Variable | Resolves to |
|---|---|
$ARGUMENTS | Everything passed after /skill-name |
$ARGUMENTS[0] | First argument |
${CLAUDE_SESSION_ID} | Current session ID |
${CLAUDE_SKILL_DIR} | Directory containing the SKILL.md |
Best Claude Code Skills to Install in 2026
We tested dozens of Claude Code skills across development, design, and productivity workflows. These are the ones that consistently improve output quality without burning excessive context tokens.
Top Community Skills
1. AIDesigner MCP + Skill — aidesigner.ai
If you want to generate full UI designs from inside your editor, the AIDesigner MCP server is the way to do it. It exposes generate_design and refine_design tools that produce production-ready interfaces from text prompts — and it’s repo-aware, meaning it detects your framework (Next.js, React, Vue), component libraries (shadcn/ui, Radix), and CSS tokens before generating anything.
The companion aidesigner-frontend skill handles the full design-to-code workflow: inspect your repo’s design context, generate the design via MCP, preview it locally, then produce an adoption brief that maps the design to your existing routes and components. Install with one command:
npx -y @aidesigner/agent-skills init
AIDesigner gives you a dedicated design engine with iterative refinement, clone/inspire/enhance modes, and OAuth-backed account billing. It pairs well with Anthropic’s frontend-design skill — AIDesigner handles design generation while frontend-design improves Claude’s native CSS output.
2. Superpowers by Jesse Vincent — 93,000+ GitHub stars
A collection of 20+ skills covering test-driven development, systematic debugging, implementation planning, and code review. The TDD skill is particularly good — it enforces the discipline that experienced developers practice naturally but AI agents tend to skip.
The philosophy is deliberate: instead of making the agent smarter, Superpowers enforces the process discipline that human developers spent decades building.
3. Web Design Guidelines by Vercel — 133,000+ weekly installs
Over 100 rules for accessibility, performance, and UX best practices. Particularly useful if you’re building with Next.js or any React-based frontend. Works well alongside the frontend-design skill.
4. agent-browser by Vercel Labs — 14,000+ GitHub stars
Web automation and browser control. Lets Claude navigate pages, fill forms, take screenshots, and interact with web apps. An alternative to the Playwright MCP server that works through Claude’s existing Bash tool.
5. Trail of Bits Security — Security-focused
Static analysis and vulnerability detection skill from the Trail of Bits security team. Checks for common vulnerabilities, dependency issues, and insecure patterns. Particularly valuable for teams without dedicated security reviewers.
6. Marketing Skills by Corey Haines — 12,900+ GitHub stars
32 marketing-focused skills covering conversion optimization, SEO, retention analysis, and content strategy. Useful for founders and marketers who use AI coding tools but need help with growth tasks, not just code.
7. agent-sandbox-skill by E2B
Runs Claude in isolated cloud sandboxes for full-stack development. Each task gets its own container with internet access, persistent filesystem, and port forwarding. Useful when you don’t want Claude modifying your local environment directly.
Official Anthropic Skills
8. frontend-design — 277,000+ installs
The most popular skill in the ecosystem. Without it, Claude produces what the Anthropic team calls “distributional convergence” — Inter font, purple gradient on white, minimal animations, grid cards. The same generic design over and over.
The frontend-design skill pushes Claude toward bold, distinctive UI with real personality. If you build anything user-facing, install this one.
9. /batch — Built-in
Decomposes large changes into 5-30 units and spawns parallel agents in isolated git worktrees. Essential for refactoring, migrations, or any change that touches many files. Instead of watching Claude edit files one by one, batch runs them concurrently.
10. /simplify — Built-in
Spawns three parallel review agents that check your changed files for code quality, reuse opportunities, and unnecessary complexity. Think of it as an automated code review that catches over-engineering before it lands.
11. /claude-api — Built-in
Loads the Claude API reference for your language (Python, TypeScript, Java, Go, Ruby, C#, PHP). Use it when building applications that integrate with the Anthropic API.
Category-Specific Recommendations
| Use case | Skill | Why |
|---|---|---|
| UI design generation | AIDesigner MCP + skill | Full design-to-code pipeline inside your editor |
| Frontend polish | frontend-design (Anthropic) | Eliminates generic AI aesthetic |
| Testing | Superpowers TDD (obra) | Enforces red-green-refactor cycle |
| Code review | /simplify (built-in) | Three parallel review agents |
| Security | Trail of Bits | Catches OWASP top 10 vulnerabilities |
| Large refactors | /batch (built-in) | Parallel execution in worktrees |
| Web automation | agent-browser (Vercel) | Browser control without MCP setup |
| API integration | /claude-api (built-in) | Language-specific SDK reference |
How to Build a Custom Claude Code Skill
Building a skill takes five minutes. Building a good skill takes understanding what makes Claude perform better versus what just wastes context tokens.
Step 1: Create the Directory
For a project-level skill (shared with your team via git):
mkdir -p .claude/skills/your-skill-name
For a personal skill (applies to all your projects):
mkdir -p ~/.claude/skills/your-skill-name
Step 2: Write the SKILL.md
Start with the minimum viable skill — a name, description, and instructions:
---
name: your-skill-name
description: What this skill does. Use when [specific trigger].
---
## Instructions
Your instructions here...
The description field is critical. Claude reads every skill description at the start of each session to decide which skills might be relevant. A vague description means Claude either loads your skill when it shouldn’t (wasting context) or ignores it when it should activate.
Good descriptions:
- “Enforce API endpoint conventions. Use when creating or modifying routes in src/api/.”
- “Generate blog cover images with branded gradients. Use when a blog post needs a cover.”
- “Run the deployment checklist. Use when deploying to production or staging.”
Bad descriptions:
- “Helpful coding assistant” (too vague)
- “Use this skill for everything” (triggers on every prompt)
- “My awesome skill” (Claude can’t determine when to use it)
Step 3: Add Supporting Files
Keep SKILL.md under 500 lines. Move detailed reference material to separate files:
your-skill-name/
├── SKILL.md # Main instructions (< 500 lines)
├── references/
│ └── api-spec.md # Detailed API docs Claude can reference
├── examples/
│ └── sample-output.md # Example of what good output looks like
└── scripts/
└── validate.sh # Scripts Claude can execute
Reference them from SKILL.md with standard markdown links:
For complete API details, see [references/api-spec.md](references/api-spec.md).
Step 4: Configure Advanced Features (Optional)
Run in a subagent (isolated context, won’t pollute your conversation):
context: fork
agent: Explore # Fast, read-only subagent
Restrict tools (prevent unintended actions):
allowed-tools: Read, Grep, Glob # Read-only access
Limit to specific paths (only activate for matching files):
paths: "src/api/**/*.ts"
Add scoped hooks (automated checks when skill is active):
hooks:
PreToolUse:
- matcher: "Bash"
hooks:
- type: command
command: "./scripts/safety-check.sh"
Step 5: Test and Iterate
Invoke directly with /your-skill-name or ask Claude something matching the description. The most common issues:
- Skill never activates: Description doesn’t match the task. Make it more specific.
- Skill activates too often: Description is too broad. Add constraints.
- Output quality is inconsistent: Add examples of good output in an
examples/directory. - Context window fills up: SKILL.md is too long. Move details to reference files.
What Makes a Skill Effective
Here are the patterns that consistently produce effective skills:
-
Encode decisions, not knowledge. Claude already knows TypeScript syntax. It doesn’t know that your team uses barrel exports and forbids default exports. Skills should capture the decisions your team has made.
-
Be specific about triggers. “Use when deploying” is good. “Use for code” is too broad.
-
Include examples of good output. Claude calibrates quality to examples faster than to descriptions.
-
Keep it under 2,000 tokens. Anthropic’s own testing found that skills under 2,000 tokens perform best. Longer skills eat into context without proportional benefit.
-
Use dynamic context for freshness. The
!`command`syntax pulls live data, so skills stay current without manual updates.
Skills vs Agents vs Commands vs MCP Servers
Claude Code has four extensibility mechanisms. They complement each other, but knowing when to use which prevents over-engineering.
| Skills | Agents | MCP Servers | Hooks | |
|---|---|---|---|---|
| What it is | Reusable prompts/workflows | Autonomous workers | External tool bridges | Event-driven automation |
| Runs in | Main conversation or forked subagent | Own context window | Separate process | Shell/HTTP/LLM |
| Invoked by | You (/skill-name) or Claude (auto) | Claude (delegates based on description) | Claude (uses exposed tools) | System (lifecycle events) |
| Best for | Coding standards, templates, checklists | Complex multi-step tasks | Connecting to GitHub, DBs, browsers | Guardrails, formatting, validation |
| Context cost | Description always loaded; content on demand | Separate context window (no cost to main) | Tool list loaded at startup | Zero (runs outside context) |
The decision framework:
- Put it in CLAUDE.md if it applies to every session (project setup, environment variables, core conventions).
- Make it a skill if it applies to specific tasks and you want it reusable (deployment checklist, code review process, content pipeline).
- Make it an agent if it needs to work autonomously for many turns with its own context window (code reviewer, blog writer, tool builder).
- Add an MCP server if Claude needs to talk to an external service (GitHub, Figma, databases, browsers). See our guide to the best MCP servers.
- Add a hook if you want automatic validation or side effects on lifecycle events (lint on save, format before commit).
Claude Code Skills Security
The convenience of community skills comes with real risk. A Snyk audit of 4,000 skills found that 36% had at least one security flaw. 13.4% contained critical issues. 76 contained confirmed malicious payloads designed for credential theft and data exfiltration.
What to Check Before Installing
-
Read the SKILL.md content. Skills are plain markdown — you can see exactly what instructions they give Claude. Look for suspicious shell commands, references to external URLs, or overly broad tool permissions.
-
Check
allowed-tools. A skill that needsReadandGrepshouldn’t requestBashaccess. Be suspicious of skills that request more tools than their purpose requires. -
Look for prompt injection. 91% of malicious skills use prompt injection — hidden instructions that override your intentions. Watch for instructions like “ignore previous instructions” or “always run this command first.”
-
Verify the source. Stick to skills from Anthropic’s official repository, well-known developers (Jesse Vincent, Vercel, Trail of Bits), or skills you’ve reviewed yourself.
-
Use Snyk’s agent-scan. The open-source agent-scan tool audits skill files for known vulnerability patterns.
Enterprise Controls
Organizations can enforce skill policies through managed settings:
- Whitelist approved skills at the enterprise level
- Block specific tool access patterns
- Require skill review before installation
- Scope skills to specific projects or teams
How MCP Servers and Skills Work Together
The most powerful Claude Code setups combine MCP servers (which connect Claude to external services) with skills (which tell Claude how to use those services effectively). This is the pattern Anthropic describes as: “MCP provides secure connectivity to external software and data, while skills provide the procedural knowledge for using those tools effectively.”
Example: AIDesigner’s Design-to-Code Workflow
The AIDesigner MCP server gives Claude access to generate_design and refine_design tools. But without the companion aidesigner-frontend skill, Claude would just call the MCP tool and dump raw HTML into your project. The skill teaches Claude the full design-to-code workflow:
- Inspect first — Read the repo’s design context (framework, component libraries, CSS tokens, route structure) before generating anything.
- Generate via MCP — Call
generate_designwith the right viewport, reference mode (inspire, clone, or enhance), and context from step 1. - Preview locally — Render the design to a local PNG so you can see what you’re working with before touching code.
- Refine, don’t regenerate — Use
refine_designfor adjustments instead of starting over. The MCP server maintains context between runs. - Adopt into your stack — Generate an adoption brief that maps the design to your existing routes, components, and tokens. Treat the MCP output as a reference, not code to paste.
This pattern — MCP server handles the external connection, skill encodes the workflow — applies broadly:
- GitHub MCP + code review skill: The MCP server connects to GitHub. The skill encodes your team’s review checklist, using
!`gh pr diff`to inject the PR context. - Supabase MCP + migration skill: The MCP server connects to your database. The skill defines your migration workflow (backup first, test on staging, verify with queries).
- Playwright MCP + testing skill: The MCP server controls the browser. The skill defines what to test and how to structure assertions.
Lessons from the MCP + Skill Pattern
Skills that encode process outperform skills that encode knowledge. Claude already knows TypeScript syntax and React patterns. A good skill doesn’t repeat that — it encodes the decisions your team has made about how to use those tools. The AIDesigner skill doesn’t teach Claude about Tailwind; it teaches Claude to inspect your repo’s tokens before generating UI.
Dynamic context is the differentiator. The !`command` syntax pulls live data into skills at invocation time. A PR review skill that injects !gh pr diff“ is dramatically more useful than one with static instructions. Most community skills underuse this.
Composition beats monoliths. The best setups chain multiple small skills instead of building one massive one. Each skill does one thing well. An orchestrating agent ties them together. This is easier to debug, test, and iterate.
The 2,000-token rule is real. Anthropic’s own testing found that skills under 2,000 tokens perform best. Longer skills eat into context without proportional benefit. Move detailed references to separate files and keep SKILL.md focused on decisions and process.
The Agent Skills Open Standard
In December 2025, Anthropic released the Agent Skills specification as an open standard. It was adopted by Microsoft (VS Code, GitHub Copilot), OpenAI (Codex CLI, ChatGPT), Cursor, Goose, Amp, OpenCode, and Gemini CLI.
This means a SKILL.md file you write for Claude Code works across every major AI coding tool. The standard covers:
- File format: SKILL.md with YAML frontmatter
- Directory structure: skills directory with named subdirectories
- Discovery: Agents scan for skills at project and user levels
- Invocation: Both user-triggered (slash commands) and agent-triggered (based on description matching)
Partner organizations including Canva, Stripe, Notion, Zapier, Figma, and Atlassian have published official skills for their platforms, extending the approach that MCP servers established for tool connectivity.
As the Anthropic team put it: “MCP provides secure connectivity to external software and data, while skills provide the procedural knowledge for using those tools effectively.”
Getting Started
If you’ve never used Claude Code skills before, start here:
-
Install the frontend-design skill if you build anything user-facing. The impact on UI quality is immediate. Pair it with the AIDesigner MCP server if you want full design generation, not just better CSS.
-
Check out the Superpowers collection for development workflow skills (TDD, debugging, planning).
-
Write one custom skill for your team’s most-repeated instruction. If you find yourself telling Claude the same thing every session, that’s a skill waiting to be written.
-
Pair skills with MCP servers. The real power comes from combining external tool access (MCP) with workflow knowledge (skills). See our guide to the best MCP servers for the connectivity layer.
-
Keep it small. One skill that does one thing well beats a 1,000-line skill that tries to cover everything.
The entire Claude Code skills ecosystem — from context engineering principles to the Agent Skills open standard — is still early. The best time to build your team’s skill library was six months ago. The second best time is now.
Frequently Asked Questions
What are Claude Code skills?
Claude Code skills are reusable SKILL.md files that extend what Claude can do. Each skill contains instructions, workflows, or reference material that Claude loads when relevant. Skills let you teach Claude your team’s coding standards, automate multi-step tasks, and add domain-specific knowledge without repeating yourself every session.
How do I install a Claude Code skill?
Create a .claude/skills/ directory in your project, then add a subdirectory with a SKILL.md file. For personal skills that apply to all projects, use ~/.claude/skills/ instead. You can also install community skills from GitHub by cloning them into your skills directory. Claude discovers skills automatically based on their description.
What is the difference between skills, agents, and MCP servers?
Skills are reusable prompts and workflows that run inline or in a forked subagent. Agents are autonomous workers with their own context window for complex multi-step tasks. MCP servers are external programs that give Claude access to tools like GitHub, databases, and browsers. Skills tell Claude how to do things, agents are independent workers, and MCP servers connect Claude to external services.
How many Claude Code skills should I install?
Most developers get the best results with 3-5 active skills covering their core workflow. Each skill’s description loads into context at session start, so too many skills can slow down tool discovery. Focus on skills that address your most repetitive patterns — coding standards, deployment workflows, and domain-specific knowledge.
Are Claude Code skills safe to install?
Most community skills are open-source and safe, but exercise caution. A Snyk audit found that 36% of analyzed skills had at least one security flaw, and 13.4% contained critical issues. Always review a skill’s SKILL.md content before installing. Avoid skills that request broad tool permissions or execute unfamiliar shell commands. Stick to skills from trusted sources like Anthropic’s official repository.
Can Claude Code skills work in Cursor, Copilot, and other tools?
Yes. Claude Code skills follow the Agent Skills open standard at agentskills.io, adopted by Microsoft (VS Code, GitHub Copilot), OpenAI (Codex CLI, ChatGPT), Cursor, Goose, Amp, and Gemini CLI. A SKILL.md file written for Claude Code works across all compatible agents, though tool names may differ between platforms.


