Web Artifacts Builder skill: React artifacts in one file

Web Artifacts Builder is Anthropic’s skill for larger claude.ai artifacts with state or routing.

The Web Artifacts Builder skill builds complex multi-component HTML artifacts with React, Tailwind and shadcn/ui. It sets up that stack and bundles the result into a single HTML file, for claude.ai artifacts that need state, routing or a component library; it is not intended for simple one-file pages. Anthropic publishes it under Apache-2.0 in the example-skills plugin for Claude Code; it is pre-installed in the Claude apps on paid plans and available through the Skills API.

Install

From the skill’s source repository:

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

Questions

What stack does Web Artifacts Builder use?

React and Tailwind with shadcn/ui.

What does Web Artifacts Builder output?

The result is bundled into a single HTML file.

When is Web Artifacts Builder not the right skill?

For simple one-file pages; it is meant for artifacts that need state, routing or a component library.

How do I install Web Artifacts Builder in Claude Code?

Add the anthropics/skills marketplace, then install the example-skills plugin with the two commands above.

Sources

Web Artifacts Builder source
License: Apache-2.0

Checked October 2, 2026.

Install

Questions

Sources

Design & frontend