Web Artifacts Builder

Overview

Web artifacts are self-contained HTML files with embedded React components. This skill should be invoked when building interactive web UIs as standalone artifacts, dashboards, or prototypes.

Core Principles

• Self-Contained: All code in single HTML file
• Component Library: Use shadcn/ui components
• Styling: Tailwind CSS for styling
• Accessibility: Follow ARIA guidelines

Preparation Checklist

• Set up React project with Tailwind
• Install shadcn/ui components needed
• Plan component structure
• Configure export mechanism