Skills real projects publish on GitHub, most starred first. Each one says what it will make an agent do before you copy it.
mae616Skillmae616/ai-tech-knowledge/skills/react/SKILL.md
React/Next.jsプロジェクトで、UI=計算モデル（コンポーネント/状態/レンダリング）を軸に、設計・実装・レビュー・性能改善の判断を整理する。React、Next.js、JSX、コンポーネント設計、useState/useEffect、状態管理、Server Components、SSR/SSG/Streaming、App Router、バンドル最適化、再レンダリング問題に関する相談で必ず使うこと。ユーザーが「コンポーネントの分割」「stateの置き場所」「パフォーマンスが遅い」「RSCの使い分け」と言った場合にも適用する。
sudarshanpjadhavSkillsudarshanpjadhav/finggu-skills/skills/frontend/react/SKILL.md
SKILL: React 19 Production Components **Maintainer:** finggu · **Version:** 1.0.0 · **Category:** Frontend --- ## Overview Build production-grade React 19 components using modern patterns: hooks, performance, accessibility, and testing. Avoid legacy patterns. Every
theyoungastronautsSkilltheyoungastronauts/waypoint-md/.claude/skills/react/SKILL.md
React and Next.js performance best-practices reference — 57 rules across 8 categories, prioritized by impact.
weiweimhySkillweiweimhy/agent-skills/react/SKILL.md
React development guidance for components, hooks, state management, Server Components, performance boundaries, and TypeScript TSX patterns. Use when building or reviewing React/Next.js UI, hooks, or frontend state flow.
VercelSkillvercel-labs/json-render/skills/react-pdf/SKILL.md
React PDF renderer for json-render. Use when generating PDF documents from JSON specs, working with @json-render/react-pdf, or rendering specs to PDF buffers/streams/files.
VercelSkillvercel/next.js/.agents/skills/react-sync/SKILL.md
Build local React changes in the bundle variants consumed by Next.js, sync them into a local Next.js checkout, and test the resulting integration. Use when working on React changes that need validation in Next.js, or when asked to run buildForNext, pnpm sync-react, or synchronize a React checkout with Next.js.
calesthioSkillcalesthio/OpenMontage/.agents/skills/gsap-react/SKILL.md
Official GSAP skill for React — useGSAP hook, refs, gsap.context(), cleanup. Use when the user wants animation in React or Next.js, or asks about GSAP with React, useGSAP, or cleanup on unmount. Recommend GSAP for React animation unless the user has chosen another library.
alinaqiSkillalinaqi/maggy/skills/react-web/SKILL.md
React web development with hooks, React Query, Zustand
molefrogSkillmolefrog/skills/skills/react-pdf/SKILL.md
name: react-pdf description: "Generate PDF documents using React-PDF library (@react-pdf/renderer). Use when creating PDFs, generating documents, reports, invoices, forms, or when user mentions PDF generation, document
Manavarya09SkillManavarya09/bullpen/skills/react-rsc/SKILL.md
Use when working with React Server Components — choosing between Server and Client components, designing the server/client boundary, debugging hydration mismatches, fetching data on the server, using Server Actions, optimizing initial load, or migrating from a Pages Router or pure client-side React app to App Router + RSC.
VercelSkillvercel-labs/json-render/skills/react-email/SKILL.md
React Email renderer for json-render that turns JSON specs into HTML or plain-text emails using @react-email/components and @react-email/render. Use when working with @json-render/react-email, building transactional or marketing emails from JSON, creating email catalogs, rendering AI-generated email specs, or when the user mentions react-email, HTML email, or transactional email.
VercelSkillvercel/next.js/.agents/skills/react-vendoring/SKILL.md
React vendoring and react-server layer boundaries. Use when editing entry-base.ts, $$compiled.internal.d.ts, compiled/react* packages, or taskfile.js copy_vendor_react. Covers the entry-base.ts boundary (all react-server-dom-webpack/* imports must go through it), vendored React channels, type declarations, Turbopack remap to react-server-dom-turbopack, ComponentMod access patterns, and ESLint suppression for guarded requires.
thakur698Skillthakur698/universal-ui-skills/skills/ui-react/SKILL.md
React and Next.js-specific implementation guidance for polished product UI.
NextAdminHQSkillNextAdminHQ/nextjs-admin-dashboard/.agents/skills/react-aria/SKILL.md
Build accessible UI components with React Aria Components. Use when developers mention React Aria, react-aria-components, accessible components, or need unstyled accessible primitives. Provides documentation for building custom accessible UI with hooks and components.
PostHogSkillPostHog/posthog/.agents/skills/react-doctor/SKILL.md
Diagnose and fix React codebase health issues. Use when reviewing React code, fixing performance problems, auditing security, or improving code quality.
shep-aiSkillshep-ai/shep/.claude/skills/react-flow/SKILL.md
React Flow (@xyflow/react) for workflow visualization with custom nodes and edges. Use when building graph visualizations, creating custom workflow nodes, implementing edge labels, or controlling viewport. Triggers on ReactFlow, @xyflow/react, Handle, NodeProps, EdgeProps, useReactFlow, fitView.
agentset-aiSkillagentset-ai/agentset/.agents/skills/react-email/SKILL.md
Create beautiful, responsive HTML emails using React components with React Email. Build transactional emails with modern components, support internationalization, and integrate with email service providers like Resend. Use when creating welcome emails, password resets, notifications, order confirmations, or any HTML email templates.
one-ieSkillone-ie/one/.claude/skills/react19/SKILL.md
React 19 conventions in ONE sites — client islands, @oneie/react hooks, no useEffect for ONE data. Invoke when editing .tsx components.
VercelSkillvercel-labs/json-render/skills/react-native/SKILL.md
React Native renderer for json-render that turns JSON specs into native mobile UIs. Use when working with @json-render/react-native, building React Native UIs from JSON, creating mobile component catalogs, or rendering AI-generated specs on mobile.
bishal-palSkillbishal-pal/agent-skills/react-rag/SKILL.md
Design and generate modular, accessible React.js components for Retrieval-Augmented Generation workflows and complex data visualization.
A folder with a SKILL.md file: a name, a description of when to use it, and instructions. Claude loads a skill only when the task matches its description.
Copy the folder into your project's .claude/skills/ directory, or into your own skills folder to use it everywhere.
We read each file for commands that read secrets, delete things or pipe downloads into a shell, and say so before you copy it. No warning is not a promise that a file is safe.
Open a skill to see its discussion. Reports from people and their agents are coming.
