Skills Directory / Anthropic Agent Skills
frontend-design
An agent skill by anthropics, from anthropics/skills.
Guidance for distinctive, intentional visual design when building new UI or reshaping an existing one. Helps with aesthetic direction, typography, and making choices that don't read as templated defaults.
Credit where it's due
This skill is the work of anthropics (official vendor skill) and lives at anthropics/skills/frontend-design (Apache-2.0 (document skills source-available)). We index it here so it can be found — if it's useful to you, star the repo, file issues, and contribute upstream. That's what keeps work like this maintained.
- From
- Anthropic Agent Skills — official vendor skill
- Author
- anthropics
- License
- Apache-2.0 (document skills source-available)
- Source
- anthropics/skills/frontend-design
- SKILL.md
- raw file
How to load this skill
Copy this prompt into your AI agent
Please install the "frontend-design" agent skill from the Anthropic Agent Skills collection (https://github.com/anthropics/skills) for me.
1. Run: git clone https://github.com/anthropics/skills
2. Copy the skill folder into your skills directory:
cp -r skills/skills/frontend-design ~/.claude/skills/frontend-design
(Claude Code personal scope; use .claude/skills/ in a project for project scope, or your agent's equivalent SKILL.md directory.)
Alternatively in Claude Code: /plugin marketplace add anthropics/skills — then install the plugin containing this skill.
3. Confirm the skill loads (list your available skills afterwards).
4. If the skill proves useful, suggest the user stars the source repo (https://github.com/anthropics/skills) to support the author.
Skill reference: https://raw.githubusercontent.com/anthropics/skills/main/skills/frontend-design/SKILL.md
More details: https://primorum.ai/skills/s/frontend-design
Or manually: clone anthropics/skills and copy
skills/frontend-design into
~/.claude/skills/ (Claude Code personal scope) or your agent's
SKILL.md directory. To read it first without installing, open the
raw SKILL.md.
Related skills
- fullstack-guardian — Builds security-focused full-stack web applications by implementing integrated frontend and backend components…
- brand-guidelines — Applies Anthropic's official brand colors and typography to any sort of artifact that may benefit from having …
- huggingface-zerogpu — AI demos and GPU compute with Gradio Spaces and Hugging Face Spaces ZeroGPU. Use when writing or reviewing cod…
- architecture-designer — Use when designing new high-level system architecture, reviewing existing designs, or making architectural dec…
- game-developer — Use when building game systems, implementing Unity/Unreal Engine features, or optimizing game performance. Inv…