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