Preview Dev
starchild-ai-agent/official-skillsBuild web pages and apps with a live preview that updates as you code. This tool helps you create frontend projects, fullstack websites, or simple HTML pages. You can see your changes instantly in the browser panel.
It works with popular tools like React, Vue, Vite, Express, and FastAPI. You can also publish your preview online to share with others. No templates or placeholders are used. Only real, working code is written.
When something goes wrong, the tool helps you find and fix the problem. It checks the health of your preview and guides you to the right solution. This makes building and sharing web projects fast and reliable.
Add Preview Dev skill to your workflow
Global
mkdir -p ~/.claude/skills/preview-devProject
mkdir -p .claude/skills/preview-devSource Repository
More Frontend Development Claude Code Skills
Frontend Designanthropics/skills
Create striking frontend interfaces with bold design and polished code every time
Vercel React Best Practicesvercel-labs/agent-skills
Optimize React and Next.js apps using proven Vercel performance guidelines
Design Taste Frontendleonxlnx/taste-skill
Enforce premium frontend design with metric-based rules and smart component architecture
Vercel Composition Patternsvercel-labs/agent-skills
Clean React components with composition instead of boolean props
Shadcnshadcn/ui
Manage shadcn UI components easily with CLI commands and clear styling rules
Impeccablepbakaus/impeccable
Polish your frontend interfaces with expert design critique and code
Minimalist Uileonxlnx/taste-skill
Build warm minimal web interfaces with editorial typography and flat bento grids
Industrial Brutalist Uileonxlnx/taste-skill
Raw mechanical UIs fusing Swiss print with military terminal aesthetics and high data density