4,126 mods tagged React that install into Claude Code, measured the same four ways as everything else here: what each costs in tokens on every session, what a security scan found and why, whether it is the original, and what changed.
verygoodsecurity/collect-js-react
Skill Claude CodeCodex
Help VGS customers integrate, implement, migrate, troubleshoot, or review the public @vgs/collect-js-react wrapper. Use when users ask to add VGS Collect to React apps, create cards with Card Management Platform through VGSCollectSession, configure VGSCollectSession or VGSCollectForm, render secure React field…
vanessamarely/ai-playbook-reposito
Skill Claude CodeCodex
Audit React components for WCAG 2.2 compliance and suggest fixes. Use when the user wants an accessibility review of existing React component code (as opposed to running automated CI checks or building new components).
Skill Claude Code
Provides complete shadcn/ui component library patterns including installation, configuration, and implementation of accessible React components. Use when setting up shadcn/ui, installing components, building forms with React Hook Form and Zod, customizing themes with Tailwind CSS, or implementing UI patterns like…
Skill Claude CodeCodex
Scaffold a new TodoMVC feature — component file, test file, and wiring — from a short description. Use when the user asks to "add feature X" and an existing file/component doesn't already own it.
Skill Claude Code
A skill that helps write idiomatic React components.
Agent Claude Code
You are a UI designer who creates interfaces that are both beautiful and implementable. You design through code—React components, HTML/CSS, Tailwind—and produce working UI that developers can use directly. You understand modern design trends, platform conventions, and the balance between innovation and usability.
Skill Claude CodeCodex
Initialize vowel.to voice agent in React applications (React 19+, Next.js, TanStack Router, React Router) with complete setup including adapters, providers, hooks, and custom actions. Use when setting up voice agent integration, configuring navigation adapters, implementing custom voice actions, or integrating state…
Skill Claude CodeCodex
How to implement internationalization (i18n) in React applications using react-i18next and i18next. Use this skill whenever the user wants to add multi-language support to a React app, translate UI content, set up i18next configuration, use the useTranslation hook, withTranslation HOC, Trans component, handle…
Skill Claude Code
React Hook Form patterns with Zod validation. Use when implementing forms, validation schemas, form state management, edit forms with unsaved changes, or array fields.
Plugin Claude Code
Bundles 6 skills, 6 commands, 1 agent · 564 tokens together
House coding conventions as self-contained agent-skills- skills, commands, and a reviewer agent for TypeScript/React/Next.js — adapt to each repo's layout and toolchain.
Skill Claude CodeCodex
React component design conventions focusing on Server/Client component boundaries, composition patterns, and data flow. Auto-triggers when writing or modifying React components to ensure correct RSC patterns and optimal component architecture.
KailasMahavarkar/agentic-skills
Skill Claude Code
Integrate Lenis smooth scroll into React and Next.js projects. Use when the user wants smooth scrolling, scroll-linked animations, parallax effects, GSAP ScrollTrigger sync, Framer Motion sync, programmatic scroll-to navigation, or scroll event listening in a React app. Covers ReactLenis provider setup, useLenis hook…
Skill Claude CodeCodex
React Query v4 (TanStack Query) best practices, patterns, and troubleshooting. Use when working with useQuery, useMutation, query invalidation, caching, WebSocket integration, or any async state management in React. Based on TkDodo's comprehensive blog series.
jcarroll2007/Frontend-Agent-Skills
Skill Claude CodeCodex
How to architect frontend features in React + TypeScript apps. Use when planning or building a new frontend feature — deciding structure, component breakdown, data fetching, state, and file placement.
Skill Claude CodeCodex
Estrutura a arquitetura de um app React Native seguindo Clean Architecture — camadas, fluxo de dados unidirecional, módulos coesos e limites claros. Use ao criar módulos/features, definir estrutura de pastas ou organizar o fluxo dados→UI.
Plugin Claude Code
Bundles 1 command · 0 tokens together
Specialized agent for generating modern frontend components and scaffolding projects (React, Vue, etc.).
olakunlevpn/olakunlevpn-react-skills
Skill Claude CodeCodex
Use when writing, reviewing, or refactoring React or Next.js code — components, hooks, state management, testing, performance, TypeScript patterns, server components, or project structure. Always apply these standards to all React work.
Plugin Claude Code
Bundles 1 skill · 46 tokens together
Review React code for unnecessary useEffect patterns based on official React documentation.
Plugin Claude Code
Bundles 2 skills, 5 commands, 2 agents · 263 tokens together
A design-to-development integration tool based on Pencil, a design workflow platform. It supports design workflow automation, design-system management, design review, and converting designs into React and Tailwind code.
Plugin Claude Code
Bundles 1 skill, 1 command · 155 tokens together
Convert Figma designs to pixel-perfect production code via REST API pre-extraction. Supports React, React Native, and Flutter — handles designs of any size.
Blazity/nextjs-migration-plugin
Plugin Claude Code
Bundles 18 skills, 4 commands, 15 agents · 1,132 tokens together
Guided Claude Code plugin for migrating public websites into production-ready Next.js App Router projects.
Plugin Claude Code
Bundles 1 skill · 125 tokens together
Describe an app idea in plain language and build it end-to-end on Muhkoo: provision the backend (app key, database tables, channels, agents, serverless functions), scaffold a Vite + React client against @muhkoo/connect, verify it with a live Cypress suite, give it a responsive distinctive design, and host it at .
manssorr/tanstack-query-plugin
Plugin Claude Code
Bundles 2 skills, 1 command · 181 tokens together
TanStack Query (React Query) expert patterns for React Native/Expo. Based on TkDodo's authoritative 'Practical React Query' blog series.
Plugin Claude Code
Bundles 1 skill · 99 tokens together
Build apps on the Agora SDK (@agora-sdk/): provider+hooks model for comments, reactions, feeds, auth, chat, spaces — plus the fork's divergences from upstream Replyke. Skills look things up via a bundled API surface, the consumer's installed .d.ts, and (optionally) the Replyke docs, so they work offline.
At most 3 mods per repository are shown here, and a mod shipped inside a plugin is left to that plugin's page — the rest are on their repository pages: