Frontend
UI components, design systems, and component generation
12 tools
Frontend Design
Frontend design and UI/UX development guidance for Claude.
Web Artifacts Builder
Build complex HTML artifacts with React and Tailwind.
React Best Practices
React and Next.js performance optimization guidelines from Vercel Engineering.
React Native Best Practices
React Native best practices optimized for AI agents with 16 rules across 7 sections.
React Composition Patterns
React composition patterns that scale and avoid boolean prop proliferation.
Magic MCP (21st.dev)
AI-driven UI component generation with a modern React/Tailwind component library.
Expo App Design
Design and build Expo/React Native mobile applications.
shadcn/ui Skill
Build accessible UI components with shadcn/ui and Tailwind.
Web Quality Skills
Agent Skills suite by Addy Osmani for Lighthouse-grade web quality, performance, accessibility, SEO, and best practices.
Web Asset Generator
Generate favicons, app icons, and social media images for web projects.
Carbon Design System MCP
IBM Carbon's official MCP — explore components, tokens, and icons and generate Carbon-compliant UI code.
module-tsx
module-tsx is well-suited for AI-generated pages — an AI can produce a single, self-contained HTML file that runs TypeScript and React directly in the browser with no build step or configuration.