React skills

1,275 tagged React, measured the same way as everything else here.

Browse within: nextjs 70javascript 32accessibility 27ui 24codex-skills 23design-system 23agentic-workflow 22components 22motion 20expo 19claude-code-skills 18ai-coding-assistant 15best-practices 15open-source 15

frontend-patterns

49

xu-xiang/everything-claude-code-zh

Skill Claude CodeCodex

A collection of front-end development patterns for React and Next.js, tools for building web interfaces and applications with JavaScript or TypeScript.

1.9k +4 6mo ago A 32 tokens original MIT

frontend-feature

50

vstorm-co/full-stack-ai-agent-template

Skill Claude CodeCodex

Build a new page, view, or data-driven feature in the Next.js frontend. Use when adding a route under the dashboard/marketing area, wiring UI to a backend endpoint, adding client state, or creating a localized page. Covers App Router, data fetching, Zustand stores, and i18n.

1.9k +2 3d ago A 64 tokens original MIT

stripe-apps

51

stripe/ai

Skill Claude CodeCodex ✓ vendor

Use when building, modifying, or reviewing a Stripe App — or when the user describes something that implies one (e.g. "add a panel to the customer page", "customize my Stripe Dashboard", "react to Stripe events from my app", "connect my service to Stripe without sharing API keys"). Covers the full app development…

1.8k +6 today A 197 tokens original MIT

react-doctor

52

Emanuele-web04/synara

Skill Claude CodeCodex

Use when finishing a feature, fixing a bug, before committing React code, or when the user types /doctor, asks to scan, triage, or clean up React diagnostics. Covers lint, accessibility, bundle size, architecture. Includes a regression check and a full local-triage workflow that fetches the canonical playbook.

1.6k +16 today A 70 tokens original MIT

callstackincubator/agent-skills

Skill Claude CodeCodex

Assesses whether and how an existing mobile product should migrate to React Native. Use when auditing one or more product repositories for migration readiness, including products whose iOS, Android, and other clients live in separate directories or repositories; choosing brownfield, greenfield, or a checkpoint-based…

1.6k +3 25d ago A 104 tokens original MIT

bklit-ui

54

bklit/bklit-ui

Skill Claude CodeCodex

Bklit UI charts and data visualization for any project using the @bklit shadcn registry. Install, compose, theme, and animate charts correctly. Triggers when working with @bklitui/ui/charts, @bklit components, data visualization, dashboards, or chart theming. Also invoke manually for chart tasks.

1.6k +14 1mo ago A 75 tokens original MIT

internet-development/www-sacred

Skill Claude CodeCodex

Keep www-sacred's TypeScript fast to type-check and fast to run. Use when touching the ASCII/canvas animation components (the only real per-frame code here), tightening type-check wall-clock, or auditing a change for runtime or compiler regressions. Scoped to this repo — a React 19 / Next.js 16 component library plus…

1.6k 11d ago A 84 tokens original MIT

internet-development/www-sacred

Skill Claude CodeCodex

Take a sacred React component (or a sacred screen that mirrors a Simulacrum CLI surface) and graft it into a foreign React codebase that already ships its own design system, build pipeline, and CSS toolchain — without breaking the host or polluting it with sacred-specific globals.

1.6k 11d ago A 0 tokens original MIT

live-codes/livecodes

Skill Claude CodeCodex

Use SDK with React, Vue, Svelte, Solid, Preact, and Web Components. sdkReady callback pattern, reactive props, and framework-specific setup. Load this skill when embedding LiveCodes in a framework application.

1.5k +2 5d ago A 51 tokens original MIT

beui-pro

58

starc007/ui-components

Skill Claude CodeCodex

Choose, inspect, install, and compose licensed beUI Pro premium React blocks from the authenticated shadcn registry. Use when building or improving landing pages with beUI Pro, installing @beui-pro items, selecting premium heroes, features, pricing, social proof, CTAs, navigation, footers, or other page sections, or…

1.4k 3d ago A 83 tokens original MIT

beui

59

starc007/ui-components

Skill Claude CodeCodex

Pick and install beUI (@beui) animated React components from the shadcn registry. Use when building motion UI, agent/chat interfaces, toasts, docks, bottom sheets, drawers, popovers, sliders, loaders, 404 pages, or any beui.dev component. Maps user intent to exact @beui install slugs instead of inventing custom…

1.4k 3d ago A 78 tokens original MIT

storybookjs/react-native

Skill Claude CodeCodex

Set up Storybook for React Native in Expo, React Native CLI, or Re.Pack projects. Use when adding Storybook to a project, configuring metro.config.js with withStorybook, creating .rnstorybook configuration files, setting up Storybook routes in Expo Router, configuring getStorybookUI, or adding the StorybookPlugin to a…

1.3k 1mo ago A 102 tokens original MIT

storybookjs/react-native

Skill Claude CodeCodex

Incrementally upgrade React Native Storybook across the supported migration paths. Use when upgrading @storybook/react-native projects from 5.3.x to 6.5.x, 6.5.x to 7.6.x, 7.6.x to 8.3.x, 8.x to 9.x, or 9.x to 10.x. Detect the currently installed Storybook version, choose only the next migration step, update…

1.3k 1mo ago A 151 tokens original MIT

storybookjs/react-native

Skill Claude CodeCodex

Create and edit React Native Storybook stories using Component Story Format (CSF). Use when writing .stories.tsx files, adding stories to React Native components, configuring Storybook addons (controls, actions, backgrounds, notes), setting up argTypes, decorators, parameters, or working with portable stories for…

1.3k 1mo ago A 83 tokens original MIT

goey-toast

63

anl331/goey-toast

Skill Claude CodeCodex

Install and use goey-toast — a gooey, morphing React toast component built on Sonner with Framer Motion. Use when adding toast/notification UI to a React app (success/error/warning/info/promise toasts), or when the user mentions goey-toast / gooey toast.

1.3k +11 2mo ago A 64 tokens original MIT

create-component

64

daangn/seed-design

Skill Claude CodeCodex

End-to-end SEED component implementation guide for React Web, Lynx, and cross-platform work. Use when adding or changing components across rootage, qvism, react/lynx packages, registry snippets, docs, examples, or when writing/refactoring docs/stories Storybook files. Story-only work follows a CSF Next fast path…

1.1k yesterday A 88 tokens original Apache-2.0

seed-design

65

daangn/seed-design

Skill Claude CodeCodex

An integration guide for SEED Design, covering shared component specifications and foundations plus React and Lynx implementation guidance.

1.1k yesterday A 140 tokens original Apache-2.0

cali

66

callstackincubator/cali

Skill Claude CodeCodex

Use when working in the Cali repository or when you need to run, extend, or debug the Cali CLI for mobile React Native and Expo workflows. Covers Cali commands (qa, review, perf-review, dev), the shared cali-context.json contract, local mode selection, required local CLIs, provider setup, and CI integration patterns.

990 2mo ago A 76 tokens original MIT

tanstack-start

67

jezweb/claude-skills

Skill Claude CodeCodex

Build a full-stack TanStack Start app on Cloudflare Workers from scratch — SSR, file-based routing, server functions, D1+Drizzle, better-auth, Tailwind v4+shadcn/ui. Use whenever the user mentions TanStack Start, asks to scaffold a full-stack Cloudflare app with SSR, wants an SSR dashboard, or asks for a React 19 +…

987 +5 2mo ago A 115 tokens original MIT

forcedotcom/sf-skills

Skill Claude CodeCodex

MUST activate when the user wants to build, create, or generate a React application, React app, web application, single-page application (SPA), or frontend application — even if no project files exist yet. MUST also activate when the project contains a uiBundles//src/ directory or sfdx-project.json and the prompt says…

952 +6 4d ago A 170 tokens original Apache-2.0

sanity-io/next-sanity

Skill Claude CodeCodex

Integrates Sanity Live with Next.js Cache Components in next-sanity v13+ apps. Sets up sanityFetch, a shared cachedSanity 'use cache' boundary, , Visual Editing, Presentation Tool, draft mode handling, and the three-layer (Page/Dynamic/Cached) component pattern with explicit perspective/stega prop-drilling. Sequences…

952 3d ago A 155 tokens original MIT

sync-public-docs

71

Caldis/react-zmage

Skill Claude CodeCodex

A documentation-synchronisation skill for the public API of react-zmage, a React component package for displaying images. It identifies documentation and example files that can become outdated when public types, props, or defaults change.

943 +1 3mo ago A 203 tokens original MIT

Caldis/react-zmage

Skill Claude CodeCodex

Use when adding the react-zmage React image viewer to an existing React, Next.js, MDX, CMS, markdown, or rich text image surface.

943 +1 3mo ago A 37 tokens original MIT