SETUP GUIDE
Install and use Agent Skills
Install a project skill in Codex or Claude Code, check its folder path and verify it with a small task.
Choose your tool
Open a project and review the original source, license and tool permissions first. The steps below use Frontend Design as the example. What is a skill?
Codex
- Open the pinned GitHub revision from the skill page. Put the whole
frontend-designfolder inside.agents/skills/in your project, including its supporting files. - Open the project in Codex. Confirm the file is at the path below. If the skill is missing, check for an extra folder level and reopen the project session.
- Select
$frontend-designin the prompt. Start with a small task you can verify, such as asking for three changes to an existing page and the files they would touch.
.agents/skills/frontend-design/SKILL.md
Optional CLI install
With Node.js 22.20 or later, run this command from the project root. It fetches the repository skill. Use the manual steps above when you need the pinned revision.
npx skills add anthropics/skills --skill frontend-design -a codex
Claude Code
- Open the pinned GitHub revision from the skill page. Put the whole
frontend-designfolder inside.claude/skills/in your project, including its supporting files. - Open the project in Claude Code. Confirm the file is at the path below. If the skill is missing, check for an extra folder level and reopen the project session.
- Run
/frontend-designin your session. Start with a small task you can verify, such as asking for three changes to an existing page and the files they would touch.
.claude/skills/frontend-design/SKILL.md
Optional CLI install
With Node.js 22.20 or later, run this command from the project root. It fetches the repository skill. Use the manual steps above when you need the pinned revision.
npx skills add anthropics/skills --skill frontend-design -a claude-code