Skill Creator

What are Claude skills?

Claude skills, also called Claude Code Agent Skills, are markdown files that teach Claude how to do one job well. Each skill is a folder with a SKILL.md file: YAML frontmatter (name and description) plus the instructions Claude should follow when the skill matches the request.

What are skills?

How do I build a skill in Claude Code?

Pick one task. Create a folder with a SKILL.md file. Write a short description that says when to use the skill, then step-by-step instructions and one example. Install it under ~/.claude/skills/ or .claude/skills/ in a project, then test a matching prompt and an unrelated prompt. skill-creator is a template for that workflow.

Create a skill

What is skill-creator?

skill-creator is this catalog’s template for writing reusable coding-agent skills. It covers structure, triggers, instructions, examples, and validation so you can turn a workflow into a skill instead of repeating the same prompt.

How do I install skill-creator in Claude Code?

Save this file as ~/.claude/skills/skill-creator/SKILL.md, or copy the Claude Code command on this page. Restart or start a new Claude Code session so it can discover the skill. For Antigravity CLI, use the install command that writes to ~/.gemini/skills/.

What is SKILL.md?

SKILL.md is the Agent Skills filename Claude Code looks for inside a skill folder. The frontmatter description is how Claude decides when to apply the skill. Some docs say skills.md; in Claude Code the file to create is SKILL.md.

Does skill-creator work with Antigravity CLI?

Yes. The same markdown template installs as a flat .md file for Antigravity CLI. Use the Antigravity command on this page if that is your assistant; use the Claude Code command if you want an Agent Skills folder.

Create a Claude Code skill for React component development

---
name: React Components
description: Create React components that follow the current project conventions. Use when asked to add a reusable UI control.
---

# React Components

Create React components that follow the current project conventions.

## Triggers

Use when asked to create a React component or add a reusable UI control.

## Instructions

1. Read the package manifest and an existing component before writing code.
2. Define typed props and use the project styling conventions.
3. Use native HTML controls with accessible names and keyboard support.
4. Include an example that uses the new component.
5. Run the project checks and report any failures.

## Validation

Try: Create a button with a label, disabled state, and click handler.
Check: The button has an accessible name, responds to keyboard input,
and cannot be activated while disabled.

Try: Explain how this project handles routing.
Check: Do not apply this component-creation workflow to that request.