# Add five skill sets to Claude Code

> Install skills for planning, design, testing and documents, then check their work on a small task.

Source: https://fullbytedeveloper.com/blog/claude-code-five-skill-sets
Keyword: SKILLS
Published: 2026-11-01

Superpowers, frontend-design, Karpathy-inspired rules, webapp-testing and document skills cover different jobs in Claude Code. I suggest starting with the one that fits your next task, then reviewing its output before adding more. The installation commands below come from the maintainers' repositories. [1] [2] [4]

Enter these commands inside Claude Code, not in your shell.

## Install Superpowers for a planned implementation

Per the Superpowers repo, its workflow starts by clarifying the requested change, gets your approval on a design, then prepares a plan with tests and review. Install it from Claude's official plugin marketplace: [1]

```text
/plugin install superpowers@claude-plugins-official
```

Give Claude a development task with a clear outcome. The repo says its skills activate automatically. You should see design discussion before implementation; inspect the proposed scope before approving it. [1]

## Add frontend-design for a specific visual brief

Register Anthropic's marketplace, then install its example bundle. These are the repository's commands. The bundle contains both frontend-design and webapp-testing, along with other example skills. [2] [6]

```text
/plugin marketplace add anthropics/skills
/plugin install example-skills@anthropic-agent-skills
```

Anthropic says you can invoke an installed skill by mentioning its name. Ask Claude to use frontend-design and supply the page's purpose, audience and real content. [2] [3]

The skill calls for a design plan covering typography, colors and layout before implementation. Check that those choices fit your brief. It also asks for mobile support, keyboard focus and reduced-motion support, so include those in your visual review. [3]

## Review the Karpathy-inspired rules before installing

The community implementation at `multica-ai/andrej-karpathy-skills` turns Karpathy's observations about coding agents into guidance on assumptions, small changes and verifiable outcomes. This is the implementation linked here; the caption's name alone does not identify a repository. [4]

Its README still gives the earlier `forrestchang` address, which redirects to the current repository. These are its plugin installation commands: [4]

```text
/plugin marketplace add forrestchang/andrej-karpathy-skills
/plugin install andrej-karpathy-skills@karpathy-skills
```

Per the repo, this makes the skill available across projects. Read it alongside your existing project rules before using it. For a small change, check the resulting diff: unrelated edits and unnecessary abstractions are exactly what these guidelines ask the agent to avoid. [4]

## Use webapp-testing on a running local page

If you installed the example bundle above, webapp-testing is already included. Mention the skill and give Claude your local page address plus the interaction to check. [2] [6]

Anthropic's skill uses Python Playwright scripts. For a running dynamic app, it instructs the agent to wait for the page to load, inspect its rendered elements, and then interact with the discovered controls. It supports screenshots and browser logs. [5]

Review the test's actual actions and results. A screenshot can show the page rendered; checking that a button submits the intended data needs a test of that behavior.

## Install document skills for the file you need

With Anthropic's marketplace already registered, install its document bundle: [2]

```text
/plugin install document-skills@anthropic-agent-skills
```

The bundle contains `docx`, `pdf`, `pptx` and `xlsx` skills. Mention the matching skill and provide the file or describe the document you need. [2] [6]

Anthropic publishes these document skills as source-available, with different licensing from its open-source examples. It also tells users to test the examples in their own environment. Open the resulting file in its normal viewer and inspect the content and formatting before sharing it. [2]

## Sources

1. [Superpowers: installation and development workflow](https://github.com/obra/superpowers)
2. [Anthropic skills: Claude Code installation](https://github.com/anthropics/skills)
3. [Anthropic frontend-design skill](https://github.com/anthropics/skills/blob/main/skills/frontend-design/SKILL.md)
4. [Karpathy-inspired guidelines: community implementation](https://github.com/multica-ai/andrej-karpathy-skills)
5. [Anthropic webapp-testing skill](https://github.com/anthropics/skills/blob/main/skills/webapp-testing/SKILL.md)
6. [Anthropic skills: plugin contents](https://github.com/anthropics/skills/blob/main/.claude-plugin/marketplace.json)

## Original posts

- [YouTube Short](https://www.youtube.com/shorts/tEUkmRSYdKE)
- [TikTok video](https://www.tiktok.com/@fullbytedeveloper/video/7702694849811729684)
- [Instagram reel](https://www.instagram.com/fullbytedeveloper/reel/DfJX6thEnmF/)