Skip to main content

artifacts-builder

Suite of tools for creating elaborate, multi-component claude.ai HTML artifacts using modern frontend web technologies (React, Tailwind CSS, shadcn/ui). Use for complex artifacts requiring state management, routing, or shadcn/ui components - not for simple single-file HTML/JSX artifacts.

Stars

13,149

Forks

969

Updated

October 18, 2025 at 16:39

Installation

/plugin marketplace add anthropics/skills

Copy and paste this command into Claude Code to install the skill

Related Skills

wshobson

paypal-integration

wshobson

Integrate PayPal payment processing with support for express checkout, subscriptions, and refund management. Use when implementing PayPal payments, processing online transactions, or building e-commerce checkout flows.

18,836web
wshobson

api-design-principles

wshobson

Master REST and GraphQL API design principles to build intuitive, scalable, and maintainable APIs that delight developers. Use when designing new APIs, reviewing API specifications, or establishing API design standards.

18,836web
wshobson

architecture-patterns

wshobson

Implement proven backend architecture patterns including Clean Architecture, Hexagonal Architecture, and Domain-Driven Design. Use when architecting complex backend systems or refactoring existing applications for better maintainability.

18,836web
wshobson

fastapi-templates

wshobson

Create production-ready FastAPI projects with async patterns, dependency injection, and comprehensive error handling. Use when building new FastAPI applications or setting up backend API projects.

18,836web
wshobson

angular-migration

wshobson

Migrate from AngularJS to Angular using hybrid mode, incremental component rewriting, and dependency injection updates. Use when upgrading AngularJS applications, planning framework migrations, or modernizing legacy Angular code.

18,836web
modu-ai

moai-domain-frontend

modu-ai

Modu-AI's Agentic Development Kit

104web
modu-ai

moai-domain-backend

modu-ai

Modu-AI's Agentic Development Kit

104web
ComposioHQ

artifacts-builder

ComposioHQ

Suite of tools for creating elaborate, multi-component claude.ai HTML artifacts using modern frontend web technologies (React, Tailwind CSS, shadcn/ui). Use for complex artifacts requiring state management, routing, or shadcn/ui components - not for simple single-file HTML/JSX artifacts.

61web
LeastBit

artifacts-builder

LeastBit

一套基于现代前端技术(React、Tailwind CSS、shadcn/ui)的工具,用来创建复杂的 claude.ai HTML 成品。适用于需要状态管理、路由或 shadcn/ui 组件的复杂作品,不适用于简单的单文件 HTML/JSX。

33web
alirezarezvani

senior-frontend

alirezarezvani

Comprehensive frontend development skill for building modern, performant web applications using ReactJS, NextJS, TypeScript, Tailwind CSS. Includes component scaffolding, performance optimization, bundle analysis, and UI best practices. Use when developing frontend features, optimizing performance, implementing UI/UX designs, managing state, or reviewing frontend code.

19web
greyhaven-ai

grey-haven-tanstack-patterns

greyhaven-ai

Apply Grey Haven's TanStack ecosystem patterns - Router file-based routing, Query data fetching with staleTime, and Start server functions. Use when building React applications with TanStack Start.

14web
greyhaven-ai

grey-haven-project-structure

greyhaven-ai

Organize Grey Haven projects following standard structures for TanStack Start (frontend) and FastAPI (backend). Use when creating new projects, organizing files, or refactoring project layout.

14web
artifacts-builder by anthropics - Claude AI Skill | SkillsMP