# react

Open-source visual editor for React — your components, drag-and-drop, no vendor CMS

Puck is an open-source visual page builder for React that gives marketing teams a drag-and-drop editor backed by your own components — no vendor CMS, no proprietary runtime, just your components rendered in a visual canvas. With 12,500+ stars, MIT license, and a small but active team at Measured Co., Puck has become the default self-hosted answer for React-native visual editing.

Production-ready React Suspense and error handling

TypeScript library extending React Suspense API with declarative components and hooks for production applications. Provides ErrorBoundary with selective error catching via shouldCatch, SSR-safe Suspense with clientOnly prop, Delay component preventing loading flashes, ErrorBoundaryGroup for coordinated resets, and data fetching components including SuspenseQuery and SuspenseInfiniteQuery. MIT licensed by Toss with three years of active development.

On-device AI inference for React Native apps

Declarative framework for running AI models on-device in React Native applications, powered by Meta ExecuTorch runtime. Supports LLMs including Llama 3.2, computer vision, OCR, embeddings, and vision-language models on iOS 17+ and Android 13+. Developed by Software Mansion with pre-built optimized models, custom model export support, and privacy-first inference without any cloud dependency for mobile AI development.

Full-stack framework for building AI copilots with generative UI

CopilotKit is an open-source full-stack framework for building AI-native applications with generative user interfaces. It provides React and Angular SDKs that enable agents to dynamically generate and render UI components, synchronize state between frontend and backend in real time, and implement human-in-the-loop workflows. Supports integration with LangChain, LangGraph, CrewAI and protocols including AG-UI, MCP, and A2A for standardized agent interaction.

Create videos programmatically with React

Remotion is a React framework that enables developers to create videos programmatically using familiar web technologies. Build videos as React components, leveraging CSS, Canvas, SVG, and WebGL for rendering. The framework includes Remotion Studio for browser-based preview with timeline scrubbing and fast refresh. Render locally, on servers, or via AWS Lambda for scalable video production. Ideal for automating social media content, data visualizations, and personalized marketing campaigns.

npm for design engineers — shadcn/ui component marketplace

21st.dev is the largest open-source marketplace of shadcn/ui-based React Tailwind components, blocks, and hooks. Used by 1.4M developers with 200K monthly active users. Functions as an MCP server enabling AI coding agents to discover and compose UI components via API. Features a Magic AI feature that generates components from natural language prompts. All components installable with npx shadcn.

Production-ready React animation library, evolved from Framer Motion

Motion (formerly Framer Motion) is the most popular React animation library, providing a declarative API for complex animations, gestures, layout transitions, and scroll-triggered effects. Supports spring physics, keyframes, shared layout animations, and exit animations. Powers animations across thousands of production React applications with an API designed for developer ergonomics.

Animated number transition component for React and frameworks

NumberFlow is a lightweight component that animates number transitions with smooth morphing effects. Numbers roll, slide, and transform between values rather than snapping instantly, adding polish to dashboards, pricing displays, counters, and financial interfaces. Available for React, Vue, Svelte, and vanilla JS with over 6,300 GitHub stars and minimal bundle impact.

Copy-paste React component collection built on Tailwind v4

Origin UI is a curated collection of copy-paste React components built with Tailwind CSS v4 and Radix UI primitives. It provides production-ready UI patterns for dashboards, forms, navigation, data tables, and settings panels. Components are designed to be dropped directly into projects with minimal modification, following modern design conventions with dark mode support.

Collection of 150+ animated React components for landing pages

Magic UI provides over 150 animated React components designed for creating visually impressive landing pages and marketing sites. Components include animated text effects, particle backgrounds, scroll-triggered animations, 3D cards, and interactive elements built on Tailwind CSS and Framer Motion. Copy-paste installation model following the shadcn/ui pattern.

Browser-native frontend coding agent for production codebases

Stagewise is an open-source frontend coding agent with 6,500+ GitHub stars that runs directly in the browser on localhost. YC S25 backed, it lets developers and designers point-and-prompt on live web applications with full devtools and console access, bridging the gap between visual editing and production codebase modification.

Local open-source AI app builder running entirely on your machine

Dyad is a local-first, open-source AI app builder with 20,000+ GitHub stars that provides a Lovable and Bolt.new alternative running entirely on your machine. It supports React and Next.js frameworks, integrates with Ollama for fully offline AI generation, and works cross-platform on macOS, Windows, and Linux with both cloud and local LLM providers.

React components for building AI chat interfaces

assistant-ui is a TypeScript/React component library for building AI chat interfaces with streaming responses, tool rendering, branching conversations, and LLM provider integrations. It supports Vercel AI SDK, LangGraph, and custom backends out of the box. Used by LangChain, Browser Use, and Stack AI. YC W25-backed with 9,000+ GitHub stars and 450K+ monthly npm downloads.

Prompt-to-React UI with HeroUI components

HeroUI Chat turns prompts or screenshots into production-ready React code using the HeroUI open-source component library with 23,000+ GitHub stars. It generates web, mobile, and even smartwatch UIs that are beautiful by default, leveraging a battle-tested component system to ensure generated code is maintainable and follows established design patterns rather than one-off AI-generated markup.

Full-stack app builder in the browser

AI-powered browser-based full-stack app builder from StackBlitz that turns natural language prompts into working web applications with zero local setup. Runs on WebContainers — a full Node.js runtime in the browser — giving AI control over filesystem, packages, terminal, and dev server. Supports React, Next.js, Vue, Astro, Svelte with live preview and one-click deploy to Netlify or Vercel. V2 adds built-in databases, auth, storage, and hosting via Bolt Cloud. 5M+ users.

Vercel's AI UI generator

Vercel's AI-powered UI generation tool that creates production-ready React and Next.js components from text or image prompts. Outputs clean code using shadcn/ui and Tailwind CSS, deployable to Vercel or copyable into existing projects. Supports iterative refinement through conversation, live browser preview, and generates accessible, responsive code. Ideal for rapidly prototyping landing pages, dashboards, forms, and UI components without manual setup.

AI-powered app builder from text prompts

Generate full-stack web applications from natural language prompts. Create.xyz produces interactive prototypes and production-ready apps with databases, authentication, and API integrations. Designed for non-technical founders and product teams who want to build and iterate on ideas rapidly without writing code from scratch.

Visual builder for React with headless CMS

Plasmic is a visual page builder and design tool that integrates directly into existing codebases, letting teams create and manage web pages with a Figma-like canvas while keeping production code under version control. Non-developers can ship marketing pages and CMS content, while engineers expose React components for visual editing. Supports Next.js, Gatsby, Remix, and any React framework.

Visual CMS and headless page builder

Builder.io is a visual development platform that lets teams create and optimize web and mobile content using a drag-and-drop editor that integrates directly with existing codebases and tech stacks (React, Next.js, Qwik, etc.). Empowers non-technical team members to publish and update digital experiences without waiting on developers. Includes headless CMS, A/B testing, and AI-powered Visual Copilot design-to-code.

AI-powered design to frontend code

Locofy is a design-to-code platform that converts Figma and Adobe XD designs into production-ready frontend code with high fidelity. Uses AI to automatically generate clean, responsive HTML/CSS/React/Next.js/React Native code from design files — eliminating labor-intensive manual translation. Includes Locofy Lightning for one-click conversion and Builder mode for custom components.

Design-to-code handoff and CSS generation

Figma Dev Mode is a dedicated workspace within Figma designed specifically for developers to inspect designs, extract code snippets, and access implementation details without navigating the full design environment. It solves the design-to-development handoff problem by providing a focused, code-oriented view with measurements, component properties, design tokens, and ready-to-use code in CSS, iOS, and Android formats.

Markdown with JSX components

MDX is a format that seamlessly combines Markdown with JSX, allowing authors to embed React components directly inside Markdown documents. It solves the problem of static content being too limited for modern web applications by making documentation interactive — charts, custom widgets, and live code examples can live alongside prose. MDX is the backbone of Docusaurus, Nextra, and countless React-based docs stacks.

Beautiful docs for Next.js App Router

Fumadocs is a documentation framework built specifically for Next.js that provides a complete set of tools for creating high-performance documentation sites within the Next.js App Router. Offers tight integration with server components, middleware, and API routes, plus headless UI primitives, MDX processing, built-in search, and flexible theming — giving teams full control over their docs' look and feel.

Next.js documentation framework

Nextra is a Next.js-based static site generator designed for documentation websites and blogs with minimal configuration. Leverages the full Next.js ecosystem with pre-built themes (Docs and Blog), MDX support, automatic file-system routing, full-text search, dark mode, and i18n. Developers get fast, SEO-friendly docs sites while keeping access to Next.js features like React Server Components.