Frontend
UI components, design systems, and component generation
36 tools
Web Artifacts Builder
Build complex HTML artifacts with React and Tailwind.
Frontend Design
Frontend design and UI/UX development guidance for Claude.
Observability And Instrumentation
Production-grade engineering skills for AI coding agents.
Performance Optimization
Skill from addyosmani: performance-optimization
Test Driven Development
Skill from addyosmani: test-driven-development
Planning And Task Breakdown
Skill from addyosmani: planning-and-task-breakdown
Source Driven Development
Skill from addyosmani: source-driven-development
Deprecation And Migration
Production-grade engineering skills for AI coding agents.
Idea Refine
Skill from addyosmani: idea-refine
Api And Interface Design
Production-grade engineering skills for AI coding agents.
Ci Cd And Automation
Production-grade engineering skills for AI coding agents.
Debugging And Error Recovery
Production-grade engineering skills for AI coding agents.
Security And Hardening
Skill from addyosmani: security-and-hardening
Git Workflow And Versioning
Skill from addyosmani: git-workflow-and-versioning
Context Engineering
Production-grade engineering skills for AI coding agents.
Using Agent Skills
Skill from addyosmani: using-agent-skills
Incremental Implementation
Skill from addyosmani: incremental-implementation
Frontend Ui Engineering
Skill from addyosmani: frontend-ui-engineering
Documentation And Adrs
Production-grade engineering skills for AI coding agents.
Browser Testing With Devtools
Production-grade engineering skills for AI coding agents.
Code Review And Quality
Production-grade engineering skills for AI coding agents.
Code Simplification
Production-grade engineering skills for AI coding agents.
Doubt Driven Development
Production-grade engineering skills for AI coding agents.
Interview Me
Skill from addyosmani: interview-me
Spec Driven Development
Skill from addyosmani: spec-driven-development
Shipping And Launch
Skill from addyosmani: shipping-and-launch
React Native Best Practices
React Native best practices optimized for AI agents with 16 rules across 7 sections.
React Best Practices
React and Next.js performance optimization guidelines from Vercel Engineering.
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.