Scaffold And Bundle Rich Single File Web Artifacts With React Tailwind And Shadcn Ui
ASecurity
Use Anthropic's web-artifacts-builder skill to scaffold a React artifact project, build a richer interface with state or routing, and bundle everything into one shareable HTML file. It is for artifact-delivery workflows, not for listing React or Tailwind as standalone products.
Installs into .claude/skills of the current project.
Are you the author of Scaffold And Bundle Rich Single File Web Artifacts With React Tailwind And Shadcn Ui?
Add the live security badge to your README. It updates with every re-scan.
[](https://www.skillsdirectory.com/skills/agentskillexchange-scaffold-and-bundle-rich-single-file-web-artifacts)
---
name: "Scaffold and bundle rich single-file web artifacts with React, Tailwind, and shadcn/ui"
slug: "scaffold-and-bundle-rich-single-file-web-artifacts-with-react-tailwind-and-shadcn-ui"
description: "Use Anthropic's web-artifacts-builder skill to scaffold a React artifact project, build a richer interface with state or routing, and bundle everything into one shareable HTML file. It is for artifact-delivery workflows, not for listing React or Tailwind as standalone products."
verification: "security_reviewed"
source: "https://github.com/anthropics/skills/tree/main/skills/web-artifacts-builder"
author: "Anthropic"
publisher_type: "Public repository"
category: "Templates & Workflows"
framework: "Claude Agents"
---
# Scaffold and bundle rich single-file web artifacts with React, Tailwind, and shadcn/ui
Use Anthropic's web-artifacts-builder skill to scaffold a React artifact project, build a richer interface with state or routing, and bundle everything into one shareable HTML file. It is for artifact-delivery workflows, not for listing React or Tailwind as standalone products.
## Prerequisites
Node.js 18+, React, TypeScript, Vite, Parcel, Tailwind CSS, and shadcn/ui
## Installation
Requirements and caveats from upstream:
- The frontmatter requires only two fields:
Basic usage or getting-started notes:
- Select document-skills or example-skills
- /plugin install example-skills@anthropic-agent-skills
- These example skills are all already available to paid plans in Claude.ai.
- Source: https://github.com/anthropics/skills/tree/main/skills/web-artifacts-builder
- Extracted from upstream docs: https://raw.githubusercontent.com/anthropics/skills/HEAD/README.md
## Documentation
- https://raw.githubusercontent.com/anthropics/skills/main/skills/web-artifacts-builder/SKILL.md
## Source
- [Agent Skill Exchange](https://agentskillexchange.com/skills/scaffold-and-bundle-rich-single-file-web-artifacts-with-react-tailwind-and-shadcn-ui/)
