React Components Hub

Directory for React Components Hub

📑 Table of Contents

• UI Components (66)
• Animation (24)
• UI Component Library (22)
• Component Library (8)
• Charts & Visualizations (12)
• Form Components (42)
• Notifications (8)
• Rich Text Editors (18)
• Media (22)
• Primitives & Foundations (5)
• State Management (18)
• Tables & Datagrids (15)
• Code Display (3)
• Data Visualization (13)
• Date & Time Pickers (6)
• Interaction (15)
• Performance (12)
• 3D Visualization (2)
• Admin UI (1)
• Carousels & Sliders (15)
• Editors (6)
• Form Management (11)
• Loading States (4)
• Table Component (3)
• Tooltips & Popovers (3)
• Utilities (32)
• Accessibility (1)
• Custom Hooks (8)
• Developer Tools (11)
• Drag & Drop (1)
• File Upload (5)
• Layout (1)
• Pagination (1)
• Routing (3)
• Testing (3)
• UI Component Libraries (4)

UI Components

• cmdk - Fast, unstyled command menu React component (⌘K) with no dependencies. Features fuzzy search, keyboard navigation, and nested commands for building custom command palettes. (Read more) Headless Command Palette Keyboard Shortcuts
• Masonic - High-performance React masonry component with virtualization. Efficiently renders tens of thousands of grid cells without lag using advanced algorithms. (Read more) Masonry Virtualization Performance
• Planby - React component for building schedules, timelines, and electronic program guides (EPG) for TV, VOD, music events, and more. Lightweight, customizable, and trusted by 100+ companies. (Read more) Scheduler Timeline Epg
• React Aria - Comprehensive collection of unstyled, accessible React hooks for building components with full keyboard navigation, screen reader support, and ARIA attributes built-in. Provides the foundation for accessible UI libraries. (Read more) Accessibility Hooks Unstyled
• React Beautiful DnD - Accessible drag-and-drop library for React with beautiful animations and physics. Provides accessible drag-and-drop functionality with support for keyboard navigation and accessibility features. (Read more) Drag Drop Accessible Animation
• React Countdown Circle Timer - Lightweight circular countdown timer with color transitions and smooth animations. Perfect for timed quizzes, workout intervals, and visual time displays. (Read more) Countdown Circular Animation
• React Grid Layout - Draggable and resizable grid layout system for React. Build dashboard-style interfaces with drag-and-drop, responsive breakpoints, and persistent layouts. (Read more) Grid Drag Drop Layout
• React Resizable Panels - Resizable panel groups for React with horizontal and vertical layouts, collapsible panels, and persistence support. Built by the creator of React DevTools. (Read more) Layout Resizable Panels
• React Shepherd - React wrapper for Shepherd.js tour library with Popper.js positioning. Create guided tours with responsive overlay dialogs in under 20 lines of code. (Read more) Tour Guides Onboarding Shepherd
• Reactour - Popular guided product tour library with 3.3k GitHub stars. Features modular packages for tours, masks, and popovers to highlight and explain app features. (Read more) Tour Guides Onboarding Walkthroughs
• Ant Design - Ant Design is a professional UI component library built for React, offering a wide range of customizable, enterprise-grade components for building consistent and scalable user interfaces. It emphasizes accessibility and supports internationalization for global applications. (Read more) Open Source Enterprise Grade Internationalization
• Flowbite React - Flowbite React is an open-source UI component library built on Tailwind CSS, offering over 30+ ready-to-use React components with dark mode support and seamless integration with modern frameworks like Next.js. It emphasizes accessibility and utility-first design principles. (Read more) Tailwind Css Dark Mode Utility First
• Heroicons - A set of over 290 beautiful, hand-crafted SVG icons created by the makers of Tailwind CSS, available in both outline and solid styles. (Read more) Icons Svg Tailwind
• kbar - Fast, portable, and extensible command palette for React applications with built-in fuzzy search, keyboard shortcuts, and priority-based command ordering. (Read more) Command Palette Keyboard Shortcuts Search
• LiveKit Components - Official open-source React components for building real-time voice, video, and messaging features with LiveKit. Includes pre-built UI components for agent sessions and audio visualization. (Read more) Open Source React LiveKit Real Time
• Lucide React - A comprehensive icon library with over 1,500 clean, consistent SVG icons designed on a 24×24 grid, built with ES modules for tree-shaking and optimal bundle size. (Read more) Icons Svg Tree Shakable
• Material UI - Comprehensive React component library implementing Google's Material Design with 150+ pre-built components. (Read more) Material Design Component Library Open Source
• Phosphor Icons React - A flexible icon family for interfaces, diagrams, and presentations with over 9,000 icons available in six different weights for unmatched design versatility. (Read more) Icons Svg Multi Weight
• React Accordion - Collapsible accordion component for React with animated transitions and keyboard navigation support. (Read more) Open Source Accordion Navigation
• React Avatar - A universal avatar component for React with automatic fallbacks, supporting images, initials, icons, and custom content with various shapes and sizes. (Read more) Avatar Profile User Initials
• React Beautiful DnD Kanban - Example extension component for creating Kanban boards with React Beautiful DnD and card-based layouts. (Read more) Kanban Drag Drop Board
• React Bootstrap - A popular React UI component library based on Bootstrap for building responsive and accessible web applications with ready-to-use components. (Read more) Bootstrap Open Source React
• React Calendar - Interactive calendar component for React with drag-and-drop support and customizable views. Supports event scheduling and time management. (Read more) Open Source Calendar Scheduling
• React Chrono - Modern, flexible timeline component for React with multiple display modes including horizontal, vertical, and vertical-alternating layouts. Supports auto-play slideshows and nested timelines. (Read more) Timeline Slideshow Responsive
• React Circular Progressbar - Circular progress indicator component built with SVG and extensively customizable. Supports text, gradients, animations, and custom children components. (Read more) Progress Circular Loading
• React Code Highlighter - Syntax highlighting component for displaying code snippets with customizable themes and language support. (Read more) Open Source Code Display Syntax Highlighting
• React Complex Tree - A feature-rich tree view component with drag-and-drop, multi-selection, renaming, and accessibility support. Lightweight with zero dependencies beyond React. (Read more) Tree View Drag Drop Accessible
• React Context Menu - Right-click context menu component for React with customizable positioning and styling. Provides accessible menus triggered by right-click or alternative triggers. (Read more) Context Menu Menus Interaction
• React Cookie Consent - A React component for displaying a cookie consent banner with customizable styling, content, and behavior, ensuring GDPR compliance for your web applications. (Read more) Gdpr Cookies Privacy Compliance
• React Copy to Clipboard - Simple React component for copying text to clipboard. Provides a lightweight wrapper around the clipboard API with fallback support for older browsers. (Read more) Clipboard Copy Utility
• React Countdown - Customizable countdown component for React with comprehensive control through renderer props. Features start, pause, and stop API methods with 275,000+ downloads. (Read more) Countdown Timer Events
• React DnD - React DnD is a flexible drag-and-drop library for React that enables developers to add interactive drag-and-drop functionality to components with minimal configuration. It supports touch devices and works well with virtualized lists. (Read more) Drag And Drop Interaction
• React Drawer Sidebar - A sliding drawer component for React applications with customizable content and responsive behavior. (Read more) Open Source Sidebar Drawer
• React Error Boundary - Error boundary wrapper component for React with built-in error recovery UI. Provides a simple way to wrap components and display fallback UI when errors occur. (Read more) Error Handling Error Boundary Resilience
• React FAQ Accordion - Responsive accordion component for displaying frequently asked questions with animate transitions. (Read more) Open Source Faq Accordion
• React Floating Action Button - Material Design floating action button component for React. Implements the Material Design floating action button pattern with customizable actions and styling. (Read more) Floating Action Button Material Design Button
• React Flow - A library for building node-based editors and data flow visualizations in React. (Read more) Open Source Node Editor Flow Visualization
• React Full Page - Fullscreen scrolling component with slides and customizable scroll duration. Built-in or custom controls with beforeChange and afterChange callbacks. (Read more) Fullscreen Scroll Slides
• React Icons - A comprehensive icon library for React with over 1000 icons from popular icon sets like Feathers, Lucide, and Heroicons. (Read more) Open Source Icons Svg
• React Icons Pack - Comprehensive icon library combining multiple popular icon sets including Font Awesome, Material Design, Ionicons, and more. Over 40,000 icons available as React components with consistent API and easy customization options. (Read more) Icons Svg Font Awesome Material Icons
• React Image Zoom - A lightweight image zoom component for React that provides magnification on hover or click with customizable settings. (Read more) Open Source Image Zoom Hover Effect
• React Joyride - React Joyride is a customizable guided tour library for React applications, providing interactive step-by-step walkthroughs to help users navigate and understand your product. (Read more) Tour Guides Onboarding Interactive
• React JSON Viewer - A React component for visually rendering and exploring JSON data with syntax highlighting and collapsible views. (Read more) Open Source Json Parser Data Visualization
• React Modal - Fully accessible modal dialog for React with customizable styles and features. (Read more) Modal Accessible Open Source
• React Modal Overlay - Lightweight modal dialog component with customizable content and accessibility features for React applications. (Read more) Open Source Modal Accessibility
• React Modal Portal - A modal dialog component that renders content into a portal, ensuring proper z-index and accessibility handling. (Read more) Open Source Modal Portal
• React Modal Sheet - A flexible bottom sheet component for React with smooth animations, snap points, and gesture support, perfect for mobile-first applications and progressive web apps. (Read more) Modal Bottom Sheet Mobile Gestures
• React Pagination - A simple and customizable pagination component for React applications with support for large datasets. (Read more) Open Source Pagination Ui Component
• React QR Code - QR code generation component for React. Generates QR codes from data with customizable size, error correction level, and styling options. (Read more) Qr Code Barcode Utility
• React Rating - A simple and customizable star rating component for React with support for half-star ratings and custom icons. (Read more) Open Source Rating Stars
• React Responsive Masonry - Lightweight React responsive masonry component built with CSS flexbox. Automatically adjusts the number of columns based on viewport width for perfect responsive layouts. (Read more) Masonry Layout Responsive
• React SaaS Pricing Table - Ready-to-use SaaS pricing table component with toggleable plans and responsive design for React applications. (Read more) Open Source Saas Pricing Table
• React Scroll - Smooth scrolling library for React with support for anchor links, scroll-to-element functionality, and smooth scroll animations. Provides utilities for both programmatic and navigation-based scrolling. (Read more) Scroll Navigation Smooth Scroll
• React Stars - Simple star rating component for React with customizable styles and hover effects. (Read more) Open Source Rating Stars
• React Tabs - A flexible tabs component for React with keyboard navigation and ARIA support. (Read more) Open Source Tabs Navigation
• React Testimonial Slider - Interactive testimonial slider component with smooth transitions for customer reviews and quotes. (Read more) Open Source Testimonials Slider
• React Toggle Switch - A highly customizable toggle switch component for React with support for different sizes, colors, and accessibility features. (Read more) Open Source Toggle Switch
• React Vertical Timeline Component - Simple, responsive vertical timeline component for React. Highly customizable timeline elements with support for custom icons, animations, and styling. (Read more) Timeline Vertical Responsive
• react-contextmenu - Context menu component for React with keyboard navigation and accessibility support. Displays custom menus on right-click with flexible positioning. (Read more) Context Menu Right Click Accessible
• react-loading-overlay - Customizable loading overlay with spinner, transitions, and message support. Wrap components and toggle loading state with custom or default spinners. (Read more) Loading Spinner Overlay
• react-masonry-css - Fast, dependency-free React masonry layout component powered by CSS. Creates Pinterest-style grid layouts with responsive breakpoints and minimal overhead. (Read more) Masonry Grid Layout
• react-sticky-el - Sticky element component that applies fixed positioning when activated. Calculates position and width automatically for smooth sticky behavior without layout shifts. (Read more) Sticky Fixed Scroll
• Schedule-X - Modern event calendar component for React with multiple view types and extensive customization options. Built with customization in mind for flexible scheduling needs. (Read more) Calendar Scheduler Events
• Shoelace UI - Shoelace UI is a modern, open-source component library for React that focuses on accessibility and modularity. It offers a set of design-agnostic components that can be easily customized to fit any design system. (Read more) Accessible Modular Customizable
• Split Pane React - Resizable split panes for React. Create horizontal and vertical split layouts with draggable dividers, supporting multiple panels and nested layouts. (Read more) Split Pane Resizable Layout
• Vaul - An unstyled drawer component for React built on Radix UI Dialog primitives, designed to replace dialogs on mobile and tablet devices with Apple-style sheet interactions. (Read more) Drawer Modal Mobile First

Animation

• AOS - Animate On Scroll - Lightweight library for animating elements as they scroll into view. Uses CSS for animations with JavaScript for logic, offering fade, flip, slide, and zoom effects. (Read more) Scroll Animations Css Animations Effects
• Framer Motion - Production-ready animation library for React with gesture support, layout animations, and shared layout animations. Powers interactive components with minimal code. (Read more) Animations Gestures Interactions
• GSAP (GreenSock) - Industry-standard professional-grade animation platform with 23.6k stars. Excels at complex sequences, timeline control, and scroll animations with modular design. (Read more) Animation Timeline Scroll
• Lottie React - Seamless integration of vector animations from Adobe After Effects. Renders high-quality, scalable animations ideal for enhancing app aesthetics. (Read more) Lottie After Effects Vector
• Motion - JavaScript and React animation library (formerly Framer Motion) with 18M monthly downloads, providing 120fps animations through hybrid engine combining Web Animations API with JavaScript flexibility. (Read more) Animations Framer Motion Performance
• React Scroll Parallax - React hooks and components for creating parallax scroll effects on banners, images, and DOM elements. Optimized for smooth performance with SSR support. (Read more) Parallax Scroll Effects
• React Spring - Spring physics-based animation library for React providing fluid, natural animations through a physics simulation engine. Used for creating interactive and performant motion effects in modern React applications. (Read more) Animations Physics Performance
• React Type Animation - Customizable typewriter component for React with sequence-based animations. Supports multiple strings, delays, backspacing, and cursor customization for landing pages. (Read more) Typewriter Text Animation Effects
• Anime.js - Lightweight JavaScript animation library with strong SVG support. Versatile animation capabilities with timeline controls and property-based animations. (Read more) Animation Svg Lightweight
• AutoAnimate - Zero-config animation library that automatically animates DOM changes (add/remove/move). Works in React via simple useAutoAnimate() hook. (Read more) Auto Animation Zero Config Dom
• Motion-Primitives - An open-source UI kit to make beautiful, animated interfaces faster, built for React, Next.js, and Tailwind CSS with pre-built animated components. (Read more) Animation Framer Motion Ui Kit
• React Awesome Reveal - An animation library for React that reveals elements with smooth animations as they enter the viewport, built on Intersection Observer for performance. (Read more) Animations Reveal Scroll Intersection Observer
• React Confetti - Confetti animation component for React. Renders falling confetti particles for celebratory effects and animations, with customizable colors, shapes, and physics. (Read more) Animation Effects Celebration
• React Confetti Explosion - Super lightweight CSS-based confetti component with explosion effects. No canvas required, pure CSS animations for celebration moments in React apps. (Read more) Confetti Celebration Effects
• React Fast Marquee - A performant marquee component for React with smooth, infinite scrolling for logos, news tickers, and continuous content displays without layout shift. (Read more) Marquee Scroll Infinite Ticker
• React FLIP Toolkit - A lightweight animation library using the FLIP technique for smooth, performant animations of layout changes, element transitions, and complex UI transformations. (Read more) Animations Flip Layout Transitions
• React Motion - A React library for creating physics-based animations with SVG and Canvas support, offering smooth and performant motion effects. (Read more) Animation Open Source React
• React Parallax - React components for creating parallax scroll effects with background images. Supports blur transitions and customizable parallax elements for engaging scroll experiences. (Read more) Parallax Scroll Effects Backgrounds
• React Reveal - A popular animation framework for React providing scroll-based reveal animations with a wide variety of effects, though note that development has slowed in favor of newer alternatives. (Read more) Animations Scroll Reveal Effects
• React Simple Animate - A lightweight animation library for React providing keyframe-based animations with hooks, focusing on simplicity and small bundle size for common animation needs. (Read more) Animations Keyframes Lightweight Hooks
• React Text Loop - An animated text loop component for React that cycles through different text strings with smooth transitions, perfect for dynamic headlines and rotating content. (Read more) Text Animation Rotating Text Transitions Headlines
• React Transition Group - Component library for managing animations and transitions in React. Provides simple API for animating component mount, unmount, and state changes. (Read more) Transitions Animations Mount Unmount
• react-smooth - A lightweight animation library for React that enables smooth transitions and animations. Based on react-motion principles but with a simpler API. Perfect for creating fluid animations in charts, data visualizations, and UI components. (Read more) Animation Transitions Charts Motion
• react-transition-state - A lightweight React hook for managing transition states. Simplifies enter/exit animations by tracking mount, pre-enter, entering, pre-exit, and exiting states. Works seamlessly with CSS transitions, animations, and animation libraries. (Read more) Transitions Animation Hooks Mount Unmount

UI Component Library

• Chakra UI - React component library emphasizing developer experience, accessibility, and modularity with composable components and style props for flexible interface building. (Read more) Accessible Composable Style Props
• Grommet - A React component library focused on enterprise applications with accessible, responsive, and themable UI components. (Read more) Enterprise A11y React
• HeroUI (NextUI) - Beautiful, fast, and modern React UI library with 50+ components. Built on React Aria for accessibility with customizable themes and variants for diverse design needs. (Read more) Ui Library Accessible Themeable
• Mantine - Fully functional React UI library with 100+ customizable components, 50+ hooks, TypeScript support, and 25k GitHub stars, offering flexibility and modern design patterns. (Read more) Typescript Open Source Hooks
• Next UI - A popular React component library providing tabs, accordions, pagination, and other UI elements with extensive documentation and community support. (Read more) Next UI Open Source React
• PrimeReact - Rich open-source React component library with 100+ components designed for the PrimeNG ecosystem, offering 156k weekly NPM downloads and enterprise-grade UI components. (Read more) Enterprise Comprehensive Open Source
• Radix UI - Low-level primitives for building accessible design systems with unstyled, composable components like Dialog, Dropdown, and Tooltip that serve as the foundation for libraries like shadcn/ui. (Read more) Accessible Headless Primitives
• Semantic UI React - Library for building user interfaces with clean HTML and consistent components, offering extensive customization options. (Read more) Semantic UI Open Source React
• Aceternity UI - A collection of 200+ beautiful, copy-paste UI components built with React, Next.js, Tailwind CSS, and Framer Motion for creating stunning animated interfaces. (Read more) Animation Framer Motion Tailwind
• Blueprint UI - Provides common React UI components with a focus on ease of use, customization, and responsive design for web applications. (Read more) Blueprint Open Source React
• DaisyUI - A popular, free Tailwind CSS component library that extends Tailwind with component class names, offering pure CSS components with zero JavaScript. (Read more) Tailwind Css Only Components
• Fluent UI - A data-driven UI component library based on Microsoft's design system, offering charts, graphs, and visualizations for React applications. (Read more) Fluent UI Open Source React
• Headless UI - A React component library designed to work without a DOM, offering lightweight and performant UI elements. (Read more) Headless UI Open Source React
• KendoReact - A professional suite of 100+ native React components including grids, charts, schedulers, and editors, built from the ground up for React with no jQuery dependencies. (Read more) Enterprise Data Grid Charts Native React
• Material Tailwind - An open-source React UI library built with Tailwind CSS and Material Design principles. It provides ready-to-use components that combine Material Design's aesthetic with Tailwind CSS's utility-first styling approach. (Read more) Tailwind Css Material Design Open Source
• Mobiscroll - A comprehensive UI library for React with advanced calendar, scheduler, date picker, and form components optimized for both desktop and mobile experiences. (Read more) Calendar Scheduler Date Picker Mobile Friendly
• React Spectrum - Adobe's React implementation of the Spectrum design system. Provides accessible, adaptive, and internationalized React components that work seamlessly across desktop and mobile devices. Built with React Aria hooks for maximum flexibility and accessibility compliance. (Read more) Ui Design System Accessibility Adobe Spectrum
• React Suite - A library designed for middle platform and back-end products, offering a friendly development experience with ready-to-use UI components. (Read more) React Open Source Back End
• React-Admin - React-Admin is a powerful framework for building admin user interfaces quickly with React, providing a comprehensive set of tools for CRUD operations and data visualization. It integrates seamlessly with REST/GraphQL APIs and supports customization through extensive plugin options. (Read more) Admin Interface CRUD Open Source
• Shards React - Open-source library of reusable React components for building modern web interfaces, available on DesignRevision. (Read more) Open Source React Components Design System
• Syncfusion React Components - A comprehensive suite of 80+ enterprise-grade React UI components including data grids, charts, schedulers, editors, and more with extensive features and professional support. (Read more) Enterprise Data Grid Charts Comprehensive
• TailGrids - A comprehensive collection of 600+ open-source Tailwind CSS UI components and blocks for React, including ready-to-use sections for marketing sites, dashboards, SaaS applications, and e-commerce. (Read more) Tailwind Css Ui Components Design System Templates

Component Library

• Awesome React - Curated collection of React ecosystem tools, libraries, and resources by Ena Q. X. Hosted on GitHub. (Read more) Open Source Curated List React Ecosystem
• Awesome React Components - Curated List of React Components & Libraries maintained by Julien Brillout. Hosted on GitHub with CC0-1.0 license. (Read more) Open Source Curated List React Ecosystem
• Material UI (MUI) - React component library based on Google's Material Design principles. Offers a wide range of buttons, navigation elements, and data tables. (Read more) Open Source Material Design Enterprise
• MUI (Material-UI) - MUI is a popular React component library implementing Google's Material Design. It provides a wide range of ready-to-use UI components for building consistent and accessible web applications. (Read more) Material Design Open Source React
• shadcn/ui - Open-source React component library built on Radix UI and Tailwind CSS with a copy-paste approach, offering the fastest-growing 'library' in the React ecosystem with highly customizable components. (Read more) Copy Paste Tailwind Css Radix Ui
• Untitled UI React - The world's largest collection of open-source React components built with Tailwind CSS and React Aria. Includes 300+ pre-designed UI components and sections. (Read more) Tailwind CSS Open Source React
• Doist Reactist - Open source React components made with ❤️ by Doist. Includes a collection of reusable UI components for building web applications. (Read more) Open Source React UI
• Magic UI - React component library focused on animations and complex designs built with Tailwind CSS. Requires copy-paste installation. (Read more) Open Source Tailwind Css Animations

Charts & Visualizations

• Apache ECharts - Powerful charting and visualization library with WebGL rendering for handling large datasets. Supports tens of thousands of data points efficiently with advanced features. (Read more) Charts Big Data Webgl
• Nivo - Rich data visualization library offering wide selection of chart components driven by D3.js, with built-in motion, theming, and server-side rendering support. (Read more) Charts d3.js Data Visualization
• React ApexCharts - Modern charting library wrapper for React with 30+ chart types, real-time updates, and interactive candlestick charts. Perfect for financial dashboards and live data visualization. (Read more) Charts Visualization Real Time
• Recharts - Composable chart library built on React components for easy data visualization, renowned for flexibility and becoming the most popular way to deliver visualizations in the React ecosystem. (Read more) Charts Data Visualization Composable
• Tremor - Open-source React UI components styled with Tailwind CSS specifically designed for building charts and dashboards. Features 35+ fully accessible components built with React, Tailwind CSS, and Radix UI. (Read more) Open Source Tailwind Css Dashboard
• billboard.js - Re-usable, easy interface chart library based on D3 v4+. Provides a simple API for creating beautiful, interactive charts with minimal configuration. Supports numerous chart types and includes React integration for seamless component usage. (Read more) Charts D3 Visualization Graphs
• Highcharts React - Official React wrapper for Highcharts, the industry-leading charting library. Provides comprehensive charting capabilities with extensive customization options, interactive features, and professional-grade visualizations. Supports all Highcharts modules and extensions. (Read more) Charts Highcharts Enterprise Visualization
• React Chart Library - Comprehensive charting component for React with support for line, bar, pie, and interactive visualizations. (Read more) Open Source Chart Visualization
• React Chart.js 2 - React components for Chart.js, providing a simple way to create responsive, animated charts with excellent performance using canvas rendering for large datasets. (Read more) Charts Data Visualization Canvas Performance
• React ChartJS - React components for Chart.js, the popular HTML5 charting library. Provides easy-to-use React wrappers for all Chart.js chart types with TypeScript support. Includes hooks for direct chart instance access and custom plugin integration. (Read more) Charts Chartjs Graphs Visualization
• Victory - React charting library from Formidable focusing on modular building blocks with consistent API, accessibility helpers, and ARIA labels that come standard with interactive charts. (Read more) Charts Modular Accessible
• Visx - Low-level D3.js primitives from Airbnb wrapped in React, providing small, tree-shakable components with full control over styling and layout for high-performance visualizations. (Read more) d3.js Primitives Performance

Form Components

• emoji-picker-react - The most popular fully customizable emoji picker for React. Features lazy loading, multiple emoji sets, themes, and search functionality with zero required props. (Read more) Emoji Picker Input
• React Colorful - Tiny color picker component for React and Preact apps at just 2.8 KB gzipped (13x lighter than react-color). Fast, tree-shakeable, and supports multiple color formats. (Read more) Color Picker Lightweight Forms
• React Dropzone - Drag-and-drop zone component for React supporting file uploads and previews. Provides an accessible dropzone with support for multiple files and custom file handling. (Read more) File Upload Drag Drop Form
• React Mentions - Facebook/Twitter-style @mention component for textarea inputs. Supports multiple data sources, custom triggers, async loading, and flexible styling. (Read more) Mentions Autocomplete Textarea
• React Select - Open-source React select component with powerful customization options, full control over styling and behavior through render prop callbacks, offering a flexible dropdown solution. (Read more) Select Dropdown Customizable
• @smastrom/react-rating - Zero-dependency, highly customizable star rating component for React with six common rating shapes including Star, Heart, and more with smooth animations. (Read more) Rating Stars Customizable
• Algolia Autocomplete - A blazing-fast autocomplete library for React with rich features including keyboard navigation, multiple data sources, and advanced search capabilities powered by Algolia. (Read more) Autocomplete Search Fuzzy Search Performance
• Downshift - Primitive unstyled React hooks library for building accessible dropdown, select, and autocomplete components. Provides all the logic without forcing a specific UI, giving developers complete styling control. (Read more) Select Dropdown Autocomplete Accessible
• Emoji Mart - Customizable emoji picker HTML component with React support. Features custom emoji support, skin tones, GIF/SVG emojis, and extensive customization options. (Read more) Emoji Picker Customizable
• Frimousse - Lightweight, unstyled, and composable emoji picker for React by Liveblocks. Perfect for shadcn/ui projects with complete styling control and composable architecture. (Read more) Emoji Picker Unstyled
• React AutoComplete - A highly customizable autocomplete component for React with support for custom rendering and async data sourcing. (Read more) Open Source Autocomplete Search
• React Best Gradient Color Picker - Comprehensive color and gradient picker supporting solid colors, linear and radial gradients. Returns CSS strings or parsed objects with customizable degrees, opacity, and hue. (Read more) Color Picker Gradient Customizable
• React Color - A flexible and customizable React color picker component supporting multiple color models and themes. (Read more) Color Picker React UI Open Source
• React Color Picker - A customizable color selection component for React with support for various color formats and input types. (Read more) Open Source Color Picker Design
• React Credit Cards - A beautiful credit card form component for React with card type detection, formatting, validation, and realistic card flip animations for CVV entry. (Read more) Payment Credit Card Forms Validation
• React Cropper - Image cropping component for React with touch support and customizable crop areas. Provides intuitive image cropping with preview and output options. (Read more) Image Cropping Image Editor Utility
• React Dropdown Tree Select - Lightweight, fast, and customizable dropdown tree select component for displaying hierarchical data with search, multi-select, and keyboard navigation. (Read more) Dropdown Tree View Hierarchical
• React File Upload - Drag-and-drop file upload component with progress tracking and multiple file support for React apps. (Read more) Open Source File Upload Drag And Drop
• React Form Builder - Drag-and-drop form builder component that allows users to create dynamic forms at runtime with validation and export capabilities. (Read more) Open Source Form Builder Dynamic Forms
• React Form Validator - Library for real-time form validation with customizable rules and error messages in React applications. (Read more) Open Source Validation Form Management
• React Input Mask - An input masking component for React designed with attention to UX, supporting phone numbers, dates, credit cards, and custom formats with flexible API. (Read more) Input Mask Formatting Validation
• React Masked Input - A form input component with built-in masking support for phone numbers, dates, and custom formats. (Read more) Open Source Form Input Masking
• React Multistep - Headless multi-step wizard component for React. Version 6 is a complete rewrite with modern React patterns, giving developers complete flexibility over UI while managing state and logic. (Read more) Wizard Multi Step Headless
• React Number Format - Input component for formatting numbers with support for currency, phone numbers, and custom patterns. Provides flexible formatting for numeric inputs with masked input support. (Read more) Number Formatting Input Masks
• React OTP Input - One-time password (OTP) input component for React. Provides a customizable input field specifically designed for OTP/verification codes with auto-focus and paste support. (Read more) Otp Form Verification
• React Phone Number Input - An international phone number input component for React with country selection, validation, and formatting according to international standards (E.164). (Read more) Phone Input International Validation Formatting
• React PIN Input - A customizable PIN/OTP input component for React with support for various input types, auto-focus, paste handling, and accessibility features for verification code entry. (Read more) Otp Pin Verification Input
• React Range Slider Input - Lightweight (~2kB) React component wrapper for creating range sliders. Capture single values or ranges with one or two drag handles with minimal overhead. (Read more) Slider Range Input
• React Signature Canvas - React wrapper for signature_pad with HTML5 canvas support for capturing smooth signatures. Includes API methods for saving, loading, and clearing signatures. (Read more) Canvas Signature Drawing
• React Simple Keyboard - Customizable, responsive, and lightweight virtual keyboard for React. Perfect for kiosks, mobile, and web with multiple layout support and theme options. (Read more) Virtual Keyboard Touch Kiosk
• React Stepper - A step-based wizard component for guiding users through sequential multi-step processes in React applications. (Read more) Open Source Wizard Step Navigation
• React StepZilla - Multi-step wizard component for sequential data collection. Accepts React components as steps and guides users through them with built-in navigation and validation. (Read more) Wizard Multi Step Forms
• React Tag Input - Flexible and customizable tag input component for React with autocomplete, keyboard navigation, and customizable suggestions. (Read more) Tag Input React Open Source
• React Tags Input - A flexible tags input component for React with autocomplete and custom styling options. (Read more) Open Source Tags Autocomplete
• React Textarea Autosize - A drop-in replacement for textarea that automatically resizes as content changes, weighing only 1.3KB with minRows and maxRows support. (Read more) Textarea Autosize Form Input
• React Time Picker - A lightweight time selection component for React with 12/24-hour format support and keyboard navigation. (Read more) Open Source Time Picker Form Management
• React Tooltip - Lightweight and customizable tooltip component for React with keyboard navigation, theming, and accessibility features. (Read more) Tooltip React Open Source
• react-range - Accessible range slider component with minimal footprint. Bring your own styles and markup with full customization control. Under 4KB gzipped with no dependencies. (Read more) Slider Range Accessible
• react-search-autocomplete - A customizable React search box component with autocomplete functionality that filters arrays of objects. Uses fuzzy search with Fuse.js for intelligent matching and filtering. (Read more) Search Autocomplete Fuzzy Search
• react-step-progress-bar - A library to create stunning progress bars with customizable steps in React, ideal for multi-step forms, wizards, and onboarding flows. (Read more) Progress Bar Stepper Multi Step Form
• React-Uploady - Modern file upload components and hooks library for React enabling client-side file-upload features with minimal code through components like upload-button, upload-drop-zone, and upload-preview. (Read more) File Upload Drag Drop Hooks
• react-use-form-state - A lightweight React hook for managing form state with minimal boilerplate. Provides input binding, validation, and form submission handling through a simple API. Perfect for small to medium forms without the complexity of larger form libraries. (Read more) Forms Hooks Validation Lightweight

Notifications

• Notistack - Highly customizable notification snackbar library for React with stacking support. Built on Material-UI with queue management and rich configuration options. (Read more) Snackbar Toast Material Ui
• React Hot Toast - Smoking hot React notifications. Lightweight, customizable, and beautiful toast notifications with a simple API. One of the most popular toast libraries for React. (Read more) Toast Notifications Alerts
• react-loading-skeleton - Skeleton loader library for React that automatically adapts to app structure, providing animated loading placeholders with shimmer effects to improve perceived performance. (Read more) Skeleton Loading Placeholder
• react-toastify - Popular React notification library providing easy-to-use toast notifications with customizable styling and placement options for success, error, warning, and info messages. (Read more) Toast Notifications Alerts
• Sonner - Modern React notification library built specifically for React 18+ with TypeScript-first design, offering beautiful notifications and emerging as the go-to choice for contemporary React applications. (Read more) Toast Notifications React 18
• React Spinners - Collection of loading spinner and loader components for React. Provides 30+ customizable spinners with various styles and animations for displaying loading states. (Read more) Loaders Spinners Loading
• react-notification-badge - Simple notification badge React component with preset animations and customizable styling. Lightweight at 7.1kb minified with effects and color options. (Read more) Badge Notification Counter
• SweetAlert2 - A beautiful, responsive, customizable replacement for JavaScript's popup boxes with React bindings, offering rich modal dialogs with animations and extensive styling options. (Read more) Modal Alerts Dialog Notifications

Rich Text Editors

• MDXEditor - Open-source WYSIWYG editor for MDX content built on the Lexical framework. Provides inline editing where formatting appears as you type, with no separate preview pane needed. (Read more) Markdown Wysiwyg Mdx
• Quill - Free, open-source rich text editor with granular API access to content, changes, and events, using JSON as both input and output for powerful text editing capabilities. (Read more) Rich Text Editor Wysiwyg Text Editing
• react-syntax-highlighter - Syntax highlighting component for React supporting Prism or Highlight libraries, using syntax trees to efficiently update only changing DOM elements with inline styles. (Read more) Syntax Highlighting Code Display Prism
• Slate - Framework for building customizable rich text editors within React applications with plugin architecture, providing flexibility and extensibility for diverse text editing needs. (Read more) Rich Text Editor Framework Extensible
• Tiptap - Headless rich-text editor framework built on ProseMirror, designed for developers to create highly customizable editors through a modular, extension-based architecture. (Read more) Rich Text Editor Headless Extensions
• BlockNote - A modern block-based rich text editor built on top of ProseMirror, offering a Notion-like editing experience with real-time collaboration support and AI integration capabilities. (Read more) Rich Text Editor Wysiwyg Block Editor Collaboration
• CKEditor 5 for React - The official React integration for CKEditor 5, a powerful WYSIWYG HTML editor with modern features including real-time collaboration, markdown support, and extensive customization options. (Read more) Wysiwyg Rich Text Editor Collaboration Enterprise
• Froala Editor React - A beautiful, lightweight WYSIWYG HTML editor optimized for performance with powerful features including inline editing, image management, and extensive plugin support. (Read more) Wysiwyg Rich Text Editor Inline Editing Lightweight
• Jodit React - A lightweight, open-source WYSIWYG editor for React with no dependencies, offering a fast alternative to TinyMCE and CKEditor with modern features and customization. (Read more) Wysiwyg Rich Text Editor Lightweight Open Source
• Lexical - An extensible text editor framework built by Meta (Facebook) for React, designed to provide reliable, accessible, and performant text editing experiences with complete customization. (Read more) Rich Text Editor Framework Facebook Extensible
• ProseMirror - A toolkit for building rich-text editors with a document model that enables real-time collaborative editing, used as the foundation for many popular editors like TipTap and Atlassian's editor. (Read more) Rich Text Editor Toolkit Collaboration Low Level
• React Contenteditable - Contenteditable wrapper component for React enabling inline text editing. Provides controlled component interface for editable content. (Read more) Editable Contenteditable Inline Editing
• React Highlight - Code syntax highlighting component for React with support for multiple languages and themes. Integrates with Highlight.js for comprehensive language support. (Read more) Syntax Highlighting Code Themes
• React Highlight Words - React component for highlighting specific words or phrases within text. Useful for search results, text matching, and content highlighting with customizable styling. (Read more) Highlight Text Matching Search
• React Markdown - React component for rendering markdown content safely with support for custom plugins and renderers. Provides flexible markdown parsing and rendering for displaying formatted text content. (Read more) Markdown Rendering Open Source
• React Markdown Editor - Simple markdown editor with live preview, implemented with React.js and TypeScript. Lightweight at ~4.6 kB gzipped with syntax highlighting support. (Read more) Markdown Editor Lightweight
• React-Quill - React-Quill is a rich text editor component for React, built on Quill.js. It provides a WYSIWYG editor with support for formatting, images, and custom modules, making it ideal for content creation in React applications. (Read more) Wysiwyg Open Source Content Editing
• TinyMCE React - The world's most advanced WYSIWYG HTML editor with official React integration, offering powerful rich text editing with plugins for images, tables, media, and more. (Read more) Wysiwyg Rich Text Editor Html Editor Plugins

Media

• React Advanced Cropper - Flexible image cropping library with rotate, zoom, transitions, and autozoom. Create custom croppers perfectly suited for your design on desktop and mobile. (Read more) Image Crop Image Editor Customizable
• react-image-crop - Responsive image cropping tool with no dependencies. Features free-form and fixed aspect crops, touch support, and full keyboard accessibility in under 5KB gzipped. (Read more) Image Crop Image Editor Responsive
• WaveSurfer.js - Interactive waveform audio visualization and playback using Web Audio API and Canvas. Supports plugins for regions, timeline, minimap, and spectrograms. (Read more) Audio Waveform Visualization
• Yet Another React Lightbox - Modern, performant React lightbox component with responsive images, video support, zoom, and plugin architecture. Works with React 16.8+ through React 19. (Read more) Lightbox Gallery Images
• FsLightbox React - A fully-featured React lightbox component for displaying images, videos, and custom content with minimal configuration, offering smooth animations and responsive design. (Read more) Lightbox Gallery Video Images
• LightGallery React - A full-featured lightbox gallery component for React with support for images, videos, HTML5 video, YouTube, Vimeo, and interactive features like zoom and rotate. (Read more) Lightbox Gallery Video
• PDF.js - Mozilla's JavaScript PDF viewer and parser that can be integrated with React applications, providing the core engine for rendering and parsing PDF documents in the browser. (Read more) Pdf Rendering Parsing Mozilla
• PhotoSwipe - A JavaScript image gallery and lightbox with no dependencies, featuring touch gestures, responsive design, and works perfectly with React through official bindings. (Read more) Lightbox Gallery Images Touch
• React Audio Visualize - Audio visualizer for React that provides separate components to visualize both live audio streams and audio blobs. Perfect for recording and playback visualization. (Read more) Audio Visualization Waveform
• React Avatar Editor - Small avatar and profile picture component. Resize, crop, and rotate uploaded images with an intuitive UI. Features scale slider and customizable borders. (Read more) Avatar Image Editor Crop
• React Doc Viewer - File viewer for React supporting multiple document formats. Includes built-in renderers for PDF, PNG, JPEG, and more with customizable document array input. (Read more) Document Viewer File Preview Multi Format
• React Easy Crop - Lightweight, hook-friendly image cropping component ideal for avatars and basic image editing. Provides zoom and positioning controls with a simple, clean API. (Read more) Image Crop Avatar Editor
• React Image Magnifiers - Collection of responsive image magnifying React components for mouse and touch. Includes Magnifier, GlassMagnifier, SideBySideMagnifier, and PictureInPictureMagnifier components. (Read more) Image Zoom Magnifier Touch
• React Medium Image Zoom - A simple, accessible image zoom component for React inspired by Medium's image zoom functionality with smooth animations and touch support. (Read more) Image Zoom Medium Style Accessibility
• React PDF Viewer - Feature-rich React component for viewing PDF documents with zoom, search, thumbnails, bookmarks, and annotation support. Built with TypeScript and React hooks. (Read more) Pdf Document Viewer Annotations
• React Photo Album - A responsive photo gallery component for React with support for multiple layouts, lazy loading, and seamless integration with lightbox libraries. (Read more) Photo Gallery Responsive Images
• React Player - A React component for playing a variety of media types including file paths, YouTube, Vimeo, Wistia, and more. Provides a flexible, customizable player interface with support for playback controls and events. (Read more) Video Player Streaming Open Source
• React QR Scanner - A QR code scanning component for React that integrates with device cameras for real-time barcode detection. (Read more) Open Source Qr Code Camera Api
• React Video Player - A customizable video player component with playback controls, subtitles, and adaptive streaming support for React applications. (Read more) Open Source Video Player Media
• react-pdf - Display PDFs in React applications as easily as images. Supports rendering from URLs, files, or byte arrays with customizable page controls and text selection. (Read more) Pdf Document Viewer Rendering
• react-webcam - Lightweight webcam component for React with image and video capture. Simple API for accessing device cameras with screenshot and recording capabilities. (Read more) Webcam Camera Video
• Video-React - A web video player built from the ground up for HTML5 and React. It provides a complete, accessible video player component with full control over styling and functionality. (Read more) Video Player Html5 Open Source

Primitives & Foundations

• AriaKit - An open-source accessibility library that provides WCAG-compliant unstyled React components for building accessible interactive UIs. AriaKit handles keyboard navigation, focus management, and ARIA attributes automatically. (Read more) Accessibility WCAG Headless
• Ark UI - Modern headless component library with 45+ accessible components that work across React, Solid, Vue, and Svelte. Built for adaptability and composability with complete styling freedom. (Read more) Headless Accessible Framework Agnostic
• Base UI - An unstyled, accessible React component library from the MUI team that provides foundational UI components with a focus on accessibility, performance, and developer experience. Components are highly customizable and designed for building design systems. (Read more) Unstyled Accessibility Design System
• Reakit - A toolkit for building accessible UIs with React that provides a low-level component library and hooks for creating accessible, interactive UI components. Reakit focuses on accessibility as a first-class citizen, with built-in WCAG compliance and keyboard navigation. (Read more) Accessibility WCAG Unstyled
• Radix Context Menu - Headless context menu component from Radix UI. Displays a menu at the pointer location triggered by right-click or long press with full accessibility support. (Read more) Context Menu Headless Accessible

State Management

• React Router - The most popular routing library for React, handling client-side navigation and linking components together for single-page applications. (Read more) Routing Open Source React
• Redux - A predictable state container for JavaScript apps, widely used for managing application state in React applications. (Read more) state management Open Source React
• SWR - React hooks library for data fetching with support for caching, revalidation, and focus tracking. Implements stale-while-revalidate pattern for performant data fetching. (Read more) Data Fetching Hooks Caching
• Immer - A library that simplifies immutable state updates by letting you write code that looks like it mutates state, while maintaining immutability through JavaScript Proxies. (Read more) Immutable State Redux
• Jotai - Primitive and flexible state management for React with an atomic model, offering ~2M weekly downloads and bottom-up approach to global state. (Read more) Atoms State Minimal
• MobX - MobX is a state management library for React that uses observable data structures to automatically track state changes and update components. It simplifies state management with reactive data binding and minimal boilerplate code. (Read more) Reactive State Observables Open Source
• NextAuth.js - NextAuth.js is a developer-friendly authentication library for React applications built with Next.js. It supports OAuth, email, and database authentication providers with built-in session management and user profile handling. (Read more) SSO OAuth Nextjs
• React i18next - Internationalization framework for React with full support for multiple languages, namespaces, and translations. Provides hooks and HOCs for integrating i18n into React components. (Read more) I18n Internationalization Localization
• React Query - React Query is a data fetching and state management library that simplifies retrieving, caching, and updating server state in React applications. It provides declarative data handling with built-in support for pagination, sorting, and query invalidation. (Read more) Data Fetching State Management Open Source
• React Query DevTools - Developer tools for React Query providing real-time visibility into queries, cache state, and debugging. Essential companion for building and debugging React Query applications. (Read more) Debugging Devtools React Query
• React Redux - Official React bindings for Redux. Provides React hooks (useSelector, useDispatch) and components for integrating Redux state management with React applications. Optimized for performance with automatic render optimization and selector memoization. (Read more) Redux State Hooks Global State
• React Router DOM - DOM bindings for React Router providing components and hooks for building single-page applications with client-side routing. Standard routing solution for React web applications. (Read more) Routing Dom Bindings Spa
• Recoil - Recoil is a state management library for React developed by Facebook, offering a simple API for managing global state with atom-based data containers. It emphasizes simplicity and performance for medium to large applications. (Read more) Facebook Atom Based Reactive State
• Redux Saga - A middleware library for handling side effects in Redux applications using ES6 Generators. Makes async flows easy to read, test, and handle. Provides powerful patterns for managing complex async workflows, API calls, and background tasks. (Read more) Redux Middleware Async Side Effects
• Redux Toolkit - The official, opinionated, batteries-included toolset for efficient Redux development. Simplifies Redux with less boilerplate, built-in Immer for immutable updates, and Redux Thunk for async logic. Includes powerful DevTools integration and TypeScript support. (Read more) Redux State Toolkit Async
• Valtio - A minimal, proxy-based state management library for React where you can mutate state directly while keeping components reactive, praised for its simplicity. (Read more) Proxy Mutable Minimal
• XState - Finite state machines and statecharts for React, uniquely focused on managing complex application states with many states and transitions between them. (Read more) State Machines Statecharts Workflows
• Zustand - Zustand is a simple and lightweight state management library for React applications. It offers a clean API for managing global state without the need for context or complex setup, making it ideal for medium to large-scale React projects. (Read more) State Management React Hooks Minimalist

Tables & Datagrids

• React Datasheet Grid - Excel-like data grid optimized for speed with virtualized architecture. Handles hundreds of thousands of rows with copy/paste support from Excel and Google Sheets. (Read more) Spreadsheet Data Grid Excel
• React Window - Efficient React component for rendering large lists and grids. Uses virtualization to render only visible items, enabling smooth scrolling through millions of items with minimal performance impact. (Read more) Virtualization Performance Lists
• TanStack Table - Headless UI for building powerful tables and datagrids across React, Vue, Solid, and Svelte, featuring sorting, filtering, pagination, row selection, and 10-15kb lightweight bundle. (Read more) Table Datagrid Headless
• AG Grid React - The industry-leading JavaScript data grid with React support, offering advanced features like row grouping, aggregation, pivot tables, and enterprise-grade performance for complex data operations. (Read more) Data Grid Enterprise Performance Excel Like
• Glide Data Grid - A lightning-fast, no-compromise data grid for React with rich rendering capabilities, handling millions of rows with smooth 60fps scrolling and full TypeScript support. (Read more) Data Grid Performance Virtualization Typescript
• Handsontable React - A JavaScript spreadsheet component for React that mimics Excel behavior, offering familiar spreadsheet features like formulas, data validation, and cell formatting for data-intensive applications. (Read more) Spreadsheet Data Grid Excel Like Formulas
• React Infinite Scroll - Infinite scroll component for React with support for virtual scrolling and lazy loading. Automatically loads more content as user scrolls to bottom. (Read more) Infinite Scroll Lazy Loading Performance
• React JSON Table - A React component that renders JSON data into an interactive table with sorting, filtering, and pagination. (Read more) Open Source Json Data Table
• React Spreadsheet Grid - Excel-like grid component with custom cell editors, performant scroll, and resizable columns. Supports keyboard control, lazy loading, and TypeScript. (Read more) Spreadsheet Excel Data Grid
• React Table Component - A highly customizable table component with features like sorting, pagination, and filtering for React applications. (Read more) Open Source Data Table React Table
• React Table Library - Headless table library for building powerful, accessible data tables. Provides table logic without forcing specific UI or styling, allowing complete customization. (Read more) Table Datagrid Headless
• React Virtualized Table - An optimized table component that renders large datasets efficiently by only rendering visible rows. (Read more) Open Source Virtualization Performance
• react-data-grid - Feature-rich and customizable data grid React component from Comcast with support for custom cell renderers, inline editing, and sophisticated data management capabilities. (Read more) Datagrid Data Table Customizable
• react-paginate - Popular pagination component library for React with easy installation and good customization options, used by 657+ projects with flexible implementation. (Read more) Pagination Navigation Customizable
• SVAR React DataGrid - A lightweight, open-source React data grid with enterprise features including virtual scrolling, inline editing, sorting, filtering, and TypeScript support, designed for modern applications. (Read more) Data Grid Virtualization Open Source Typescript

Code Display

• Monaco Editor for React - Monaco Editor component for React based on the Microsoft Visual Studio Code editor. Provides IntelliSense, syntax highlighting, and advanced editing without webpack configuration. (Read more) Code Editor Monaco Vscode
• React Diff Viewer - Simple and beautiful text diff viewer component for React. Features split view, inline view, word diff, line highlighting, and syntax highlighting support. (Read more) Diff Code Comparison Syntax Highlighting
• React Ace - React wrapper for the Ace code editor. Lightweight and feature-rich with syntax highlighting, code completion, and keyboard shortcuts for 110+ languages. (Read more) Code Editor Ace Lightweight

Data Visualization

• React Map GL - React wrapper for Mapbox GL, providing interactive maps with layers, markers, and complex visualizations. Enables building map-based interfaces with full customization and real-time updates. (Read more) Maps Geospatial Mapbox
• SVAR React Gantt - Open-source high-performance Gantt chart with interactive timeline, drag-and-drop task management, dependencies, and TypeScript support. MIT licensed for commercial use. (Read more) Gantt Chart Timeline Project Management
• D3.js - The most powerful JavaScript library for data visualization and DOM manipulation. D3 brings data to life using HTML, SVG, and CSS. While not React-specific, it integrates well with React for creating custom, complex visualizations with full control. (Read more) D3 Visualization Svg Data Driven
• deck.gl - A WebGL-powered framework for visual exploratory data analysis of large datasets, providing high-performance layer-based rendering for maps and geospatial visualizations in React. (Read more) Webgl Geospatial Big Data 3d
• React Accessible Treeview - A WAI-ARIA compliant React tree view component with comprehensive accessibility support, highly customizable through render props and prop getters, and support for keyboard navigation. (Read more) Tree View Accessibility Aria Compliant
• React Arborist - The complete tree view component for React, enabling creation of hierarchical UIs similar to VSCode sidebar, Mac Finder, or Figma layers panel with drag-and-drop support and efficient rendering of thousands of items. (Read more) Tree View Drag Drop Open Source
• React Force Graph - React components for 2D, 3D, VR, and AR force-directed graphs. Visualize network relationships and hierarchical data with interactive force simulations. (Read more) Graphs 3d Visualization
• React Kanban - A flexible, open-source Kanban/Trello board library for React supporting both controlled and uncontrolled modes with comprehensive drag-and-drop functionality. (Read more) Kanban Drag Drop Board
• React Leaflet - React components for Leaflet, an open-source JavaScript mapping library. React Leaflet provides a declarative, React-friendly way to build interactive maps with markers, layers, and geographic features. (Read more) Maps Geospatial Open Source
• React Trello - Pluggable components to add a Trello-like kanban board to your React application with drag-and-drop support, responsive design, pagination, and touch device compatibility. (Read more) Kanban Drag Drop Trello Like
• React Vis - React Vis is a set of reusable visualization components for React, built on top of D3.js with a declarative API. It supports a wide range of chart types and provides highly customizable data visualizations for React applications. (Read more) D3js React Charts Customizable
• Reaviz - Reaviz is a modular React data visualization library leveraging D3.js for rendering charts. It offers over 20 chart types with customizable features like interactive tooltips, animations, and responsive design systems for building complex data visualizations. (Read more) D3js React Charts Modular
• recharts-scale - Scale calculation library used by Recharts for axis scaling and data transformations. Provides linear, logarithmic, power, and other scale types for mapping data values to visual coordinates. Essential for data visualization and charting. (Read more) Scales Charts D3 Visualization

Date & Time Pickers

• React DayPicker - React component for creating customizable date pickers and calendars with 6M+ weekly downloads, 6,400+ GitHub stars, and powers shadcn's calendar component and countless design libraries. (Read more) Date Picker Calendar Accessible
• react-datepicker - Popular React date picker component with 2.7M weekly downloads, using date-fns for native Date object handling and reducing package size while providing reliable date selection functionality. (Read more) Date Picker Calendar Datetime
• DHTMLX Scheduler for React - A powerful event scheduling component for React applications with Google Calendar-style interface, supporting recurring events, drag-and-drop, and multiple calendar views. (Read more) Scheduler Calendar Events Enterprise
• React Big Calendar - Event calendar component for React with multiple view modes (month, week, day, agenda) and built-in drag-and-drop support. Ideal for scheduling applications and event management interfaces. (Read more) Calendar Scheduling Events
• React Big Schedule - A powerful event calendar and scheduling component for React with day, week, and month views, supporting drag-and-drop, resource scheduling, and customizable event rendering. (Read more) Calendar Scheduler Events Drag Drop
• React Dates - An easily internationalizable, accessible, mobile-friendly datepicker library for React developed by Airbnb, featuring date range selection and single date picking. (Read more) Datepicker Date Range Airbnb

Interaction

• dnd kit - A modern, lightweight drag and drop toolkit for React that is modular, accessible, and extensible. It provides the core infrastructure for building powerful drag and drop interfaces with a focus on performance and accessibility. (Read more) Drag And Drop Accessibility Open Source
• Mantine Spotlight - Command center and search component for Mantine applications. Keyboard-driven with Cmd+K shortcut, fuzzy search, and customizable actions for quick navigation. (Read more) Command Palette Search Keyboard
• @szhsin/react-menu - An accessible React menu library that supports dropdown, context, and submenu patterns with full keyboard navigation and screen reader support. Built as a minimal, lightweight alternative to complex menu implementations. (Read more) Menu Dropdown Accessibility
• Gridstack.js - A mobile-friendly JavaScript library for building drag-and-drop, resizable grid layouts with React support, perfect for creating responsive dashboards and customizable interfaces. (Read more) Grid Drag And Drop Dashboard Resizable
• hello-pangea/dnd - A community fork of react-beautiful-dnd that maintains drag-and-drop functionality for lists with a focus on accessibility and smooth animations, keeping the beloved API while continuing development. (Read more) Drag And Drop Lists Accessibility Animations
• NextStepjs - Lightweight open-source onboarding library for React with smooth animations powered by Framer Motion. Create engaging product tours and user walkthroughs with minimal effort. (Read more) Onboarding Tours Tutorials
• OnboardJS - Open-source headless onboarding engine for React. Provides hooks and context provider to seamlessly connect the onboarding engine to React components without UI constraints. (Read more) Onboarding Headless Tours
• Pragmatic Drag and Drop - A fast and flexible drag-and-drop library built on the native HTML5 API, designed as the official evolution of react-beautiful-dnd by Atlassian, supporting multiple frameworks including React, Vue, and Svelte. (Read more) Drag And Drop Html5 Framework Agnostic Accessibility
• React Command Palette - Accessible browser-compatible command palette for React. Includes Chrome, VS Code, and Atom themes with Cmd+Shift+P keyboard shortcut for quick access. (Read more) Command Palette Keyboard Accessible
• React DnD Treeview - A draggable tree view component for React with support for nested items, drag-and-drop reordering, and customizable node rendering for hierarchical data structures. (Read more) Tree View Drag Drop Hierarchical Sortable
• React Draggable - A flexible drag-and-drop library for React with support for drag handles, constraints, and collision detection. (Read more) Open Source Drag And Drop React
• React Easy Sort - Mobile-friendly sortable list component with drag-and-drop reordering. Doesn't block page scrolling and works seamlessly on touch devices. (Read more) Sortable Drag Drop Touch Friendly
• React Sortable HOC - Set of higher-order components to turn any list into an animated, accessible, and touch-friendly sortable list with drag-and-drop reordering. (Read more) Drag Drop Sortable Reorder
• React Use Gesture - A library for adding gesture recognition to React components, supporting drag, pinch, scroll, wheel, hover, and move gestures with fine-grained control. (Read more) Gestures Touch Drag Interactions
• react-contexify - A simple and easy-to-use context menu library for React that allows you to add customizable context menus to your applications. Built with accessibility and performance in mind. (Read more) Context Menu Right Click Open Source

Performance

• react-infinite-scroll-component - Lightweight infinite scroll component with pull-to-refresh functionality. Supports both vertical and horizontal scrolling with customizable loading indicators. (Read more) Infinite Scroll Lazy Loading Virtualization
• TanStack Virtual - Headless UI for virtualizing large element lists at 60FPS. Lightweight (10-15kb) virtualization for TS/JS, React, Vue, Solid, Svelte, and more with complete control over markup and styles. (Read more) Virtualization Headless Performance
• bundlesize - Keep your bundle size in check by setting size budgets for your JavaScript bundles. Integrates with CI to fail builds when bundles exceed limits. Essential for maintaining performance in React applications and preventing bundle bloat. (Read more) Bundle Size Performance Ci
• Loadable Components - A complete solution for code-splitting and lazy-loading React components with full server-side rendering support, providing better SSR than React.lazy. (Read more) Code Splitting Lazy Loading Ssr
• React Intersection Observer - A React implementation of the Intersection Observer API for detecting when elements enter or leave the viewport, essential for lazy loading, infinite scroll, and visibility tracking. (Read more) Intersection Observer Lazy Loading Viewport Performance
• React Lazyload - Lazy loading component for React with support for images, videos, and other content. Improves page performance by loading content only when visible in the viewport. (Read more) Lazy Loading Performance Images
• React Virtualized List - High-performance scrolling component for rendering large lists and grids in React with virtualization optimization. (Read more) Open Source Virtualization List Optimization
• React Virtuoso - A powerful React virtualization library that automatically handles variable item heights and dynamically adjusts to content changes, providing smooth scrolling for lists of any size. (Read more) Virtualization Infinite Scroll Performance Lists
• React Visibility Sensor - A React component that notifies when it enters or exits the viewport, useful for lazy loading, tracking, and triggering animations based on visibility. (Read more) Visibility Viewport Lazy Loading Scroll
• react-lazy-load-image-component - React component to lazy load images with placeholder and effect support. Improves page load performance by deferring image loading until they're needed. Includes fade, blur, and opacity effects with IntersectionObserver support. (Read more) Images Lazy Loading Performance Optimization
• react-loadable - Higher-order component for loading React components with dynamic imports. Enables code-splitting at the component level with loading states, error handling, and server-side rendering support. Helps reduce initial bundle size and improve performance. (Read more) Code Splitting Lazy Loading Ssr Performance
• why-did-you-render - Notifies you about potentially avoidable re-renders in React applications. Helps identify performance issues by detecting unnecessary renders caused by unchanged props or state. Essential tool for optimizing React component performance. (Read more) Performance Debugging Optimization Re Renders

3D Visualization

• React Three Fiber - A React renderer for Three.js that brings declarative, reactive, and component-based patterns to 3D rendering. Build 3D scenes in React with all the power of Three.js. (Read more) 3d Threejs Graphics
• React Three Drei - A collection of useful helpers and abstractions for React Three Fiber. Provides ready-to-use components for cameras, controls, shapes, and effects to accelerate 3D development. (Read more) 3d Threejs Helpers

Admin UI

• Refine - Free, open-source, MIT-licensed React framework specifically designed for building data-intensive applications like admin panels, dashboards, and internal tools. Headless by design with no UI constraints. (Read more) Open Source Framework Headless

Carousels & Sliders

• Swiper - Modern open-source JavaScript carousel and slider library with React wrapper, supporting mobile touch gestures, hardware-accelerated transitions, and used by Netflix and Adobe. (Read more) Carousel Slider Touch Friendly
• Embla Carousel React - A lightweight carousel library with fluid motion and swipe precision, providing a smooth scrolling experience with React hooks and extensive plugin support. (Read more) Carousel Slider Lightweight Fluid
• Glide.js - A lightweight, flexible, and fast JavaScript ES6 slider and carousel that is completely dependency-free at just ~7kb gzipped. (Read more) Carousel Lightweight Dependency Free
• Keen Slider - A lightweight, performance-focused slider library with no dependencies, offering smooth touch interactions and extensive customization for modern web applications. (Read more) Carousel Lightweight Performance
• Keen Slider React - A lightweight, framework-agnostic carousel library with React bindings, offering smooth animations, touch gestures, and minimal footprint for modern web applications. (Read more) Carousel Slider Lightweight Touch
• Nuka Carousel - A small, fast, and accessibility-first React carousel library developed by Formidable Labs, featuring custom animations and zero dependencies. (Read more) Carousel Accessible Formidable
• Pure React Carousel - A fully controlled, responsive React carousel component with 100% test coverage, allowing flexible DOM order and complete customization without external dependencies. (Read more) Carousel Controlled Responsive
• React Carousel Slider - Responsive image and content carousel with autoplay, swipe gestures, and customizable navigation for React applications. (Read more) Open Source Carousel Slideshow
• React Image Gallery - Image gallery and carousel component for React with full-screen lightbox support. Provides customizable image galleries with thumbnail navigation and various display modes. (Read more) Gallery Carousel Lightbox
• React Multi Carousel - A production-ready, lightweight React carousel component with SSR support, responsive breakpoints, and excellent mobile touch interactions. (Read more) Carousel Responsive Ssr
• React Responsive Carousel - A dynamic and flexible carousel component that seamlessly adapts to different screen sizes with lazy loading support and hardware-accelerated transitions. (Read more) Carousel Responsive Lazy Loading
• React Slick - Carousel component for React applications offering responsive and customizable carousels with transition effects, autoplay settings, navigation buttons, and pagination controls. (Read more) Carousel Slider Responsive
• React Tiny Slider - React wrapper for Tiny Slider, a lightweight carousel/slider component. Provides responsive carousel functionality with touch support and minimal configuration. (Read more) Carousel Slider Responsive
• Splide - A lightweight, flexible, and accessible slider and carousel library with no dependencies, written in TypeScript with extensive customization options. (Read more) Carousel Slider Accessible
• Tiny Slider - A vanilla JavaScript slider that works with all browsers, extremely lightweight at 10kb gzipped, with no dependencies and excellent performance. (Read more) Carousel Vanilla Js Lightweight

Editors

• React Email - Build and send emails using React components with TypeScript support. Includes pre-built components and templates compatible with all major email clients. (Read more) Email Templates Typescript
• React Markdown Renderer - A component for rendering Markdown content in React applications with support for syntax highlighting and custom renderers. (Read more) Open Source Markdown Renderer
• React Rich Text Editor - A powerful WYSIWYG editor for React with markdown support, collaborative editing, and real-time previews. (Read more) Open Source Markdown Collaboration
• React Simple Code Editor - A lightweight code editor component for React with syntax highlighting support, designed for simplicity without extra features, perfect for embedded code editing in forms and applications. (Read more) Code Editor Syntax Highlighting Lightweight
• React Textarea Code Editor - A simple code editor component with syntax highlighting built on textarea elements, providing lightweight code editing without extra features, ideal for simple embeds and forms. (Read more) Code Editor Syntax Highlighting Textarea
• Unlayer Email Editor - Drag-and-drop email editor React component for building responsive email templates. Features WYSIWYG interface with pre-built blocks and export options. (Read more) Email Drag Drop Wysiwyg

Form Management

• React Hook Form - Performant, flexible form library using uncontrolled components and ref-based field registration to minimize re-renders, offering a clean API with optional validation schema support. (Read more) Forms Validation Performance
• Formik - Popular form management library handling field values, validation, errors, and submission with reduced boilerplate and tedious form wiring in React applications. (Read more) Forms Validation State Management
• React Final Form - High-performance subscription-based form state management tool for React with small bundle size, allowing fine-grained control over field observation and re-renders. (Read more) Forms State Management Performance
• React Form Validation - A validation utility for React forms with support for real-time feedback and customizable validation rules. (Read more) Open Source Form Validation React Validation
• React Hook Form DevTools - A development tool component for React Hook Form that visualizes form state, validation errors, and field values in real-time, making form debugging effortless. (Read more) Forms Devtools Debugging React Hook Form
• React JSON Schema Form - Build React forms automatically from JSON Schema. Generates form UI, validation, and submission handlers from schema definitions. (Read more) Forms Json Schema Auto Generation
• React Step Wizard - Flexible multi-step wizard for React with custom transitions and hash-enabled navigation. Each child component becomes an individual step with built-in navigation controls. (Read more) Wizard Multi Step Forms
• TanStack Form - A headless, performant, and type-safe form state management library for React, created by the team behind TanStack Table and TanStack Query, supporting complex validation and async operations. (Read more) Forms Validation Typescript Headless
• Valibot - A modular, type-safe schema validation library optimized for bundle size, offering an alternative to Zod with better tree-shaking and smaller footprint for React applications. (Read more) Validation Typescript Schema Lightweight
• Yup - A JavaScript schema validation library for runtime value parsing and validation, widely used with Formik and React Hook Form for building complex form validation rules. (Read more) Validation Forms Schema Javascript
• Zod - A TypeScript-first schema validation library with static type inference, providing runtime validation with excellent developer experience and seamless integration with React form libraries. (Read more) Validation Typescript Schema Type Safety

Loading States

• React Content Loader - SVG-based skeleton loading component with presets for Facebook, Instagram, lists, and code. Supports complex custom shapes for any skeleton screen design. (Read more) Skeleton Loading Svg
• React Loading - A collection of loading spinner components for React with various animation styles, providing visual feedback during asynchronous operations and data loading. (Read more) Loading Spinner Loader Feedback
• React Placeholder Shimmer - Placeholder component library with shimmer loading effects. Includes RoundImage, SquareImage, TextBlock, and Button placeholders with MediaBlock container. (Read more) Shimmer Placeholder Skeleton
• react-nprogress - A React primitive for building slim progress bars with support for hooks, render props, and HOC patterns for flexible integration. (Read more) Progress Bar Loading Ui Feedback

Table Component

• React Table - A powerful React table component with sorting, filtering, pagination, and row selection capabilities for complex data visualization. (Read more) Data Table React TanStack
• React Virtualized - A set of React components for efficiently rendering large lists and tabular data via virtualization techniques. (Read more) Virtualization React Performance
• Reactable - An editable data grid / spreadsheet component for React with built-in sorting, filtering, and pagination features. (Read more) Data Grid React Open Source

Tooltips & Popovers

• Tippy.js - Complete tooltip, popover, dropdown, and menu solution for web with 5M monthly downloads, powered by Popper library, offering extensive customization options and excellent documentation. (Read more) Tooltip Popover Dropdown
• Floating UI - Lightweight, low-level library for creating floating elements like tooltips, popovers, dropdowns, and menus with precise positioning and collision detection capabilities. (Read more) Positioning Floating Elements Headless
• React Popper - React wrapper for Popper.js providing positioning engine for dropdowns, tooltips, and popovers. Handles complex positioning logic with collision detection. (Read more) Positioning Popper Dropdowns

Utilities

• react-hotkeys-hook - React hook for declarative keyboard shortcuts with scope support and special character detection. Over 2 million weekly downloads for component-level hotkey management. (Read more) Keyboard Shortcuts Hotkeys Hooks
• Axios - Promise-based HTTP client for the browser and Node.js. Most popular library for making HTTP requests in React applications with features like interceptors, automatic JSON transformation, and request/response handling. Simple, powerful, and reliable. (Read more) Http Ajax Fetch Api
• Class Variance Authority - A declarative API for defining component variants in React, making it easy to create components with multiple visual variations like sizes, colors, and states. (Read more) Variants Tailwind Component Library
• classnames - A simple JavaScript utility for conditionally joining classNames together. Essential for React components with dynamic class names. Tiny, fast, and handles arrays, objects, and conditional logic elegantly. (Read more) Css Classnames Utility Styling
• clsx - A tiny utility for constructing className strings conditionally, providing a clean API for dynamic class name generation in React applications. (Read more) Classnames Utilities Styling
• date-fns - Modern JavaScript date utility library providing comprehensive date manipulation functions. Modular, immutable, and tree-shakeable with excellent TypeScript support. Safer and more lightweight alternative to Moment.js for React applications. (Read more) Dates Time Formatting Utility
• jest-axe - Custom Jest matcher for axe-core accessibility testing, enabling automated WCAG compliance testing in React applications through unit tests. (Read more) Accessibility Testing A11y
• Lodash - A modern JavaScript utility library delivering modularity, performance, and extras. Provides 200+ utility functions for common programming tasks like array manipulation, object operations, and functional programming. Tree-shakeable for optimal bundle size. (Read more) Utility Functional Collections Performance
• Nano ID - A tiny, secure, URL-friendly, unique string ID generator for JavaScript. 60% smaller than UUID, perfect for React applications needing unique IDs for keys, tokens, or identifiers. Fast, secure, and portable across all platforms. (Read more) Id Uuid Unique Generator
• Next SEO - SEO plugin for Next.js applications that simplifies managing meta tags, Open Graph, Twitter Cards, and JSON-LD. Provides a declarative API for all common SEO needs with TypeScript support and extensive configuration options. (Read more) Seo Meta Tags Next Js Open Graph
• React CSV - Generate CSV files and download links in React with the CSVLink and CSVDownload components. Supports arrays, objects, and custom formatting for easy data export. (Read more) Csv Export Data
• React Dev Utils - Utilities and tools for React development including error overlays, build scripts, and development helpers. Powers Create React App and other development tools. (Read more) Development Tooling Build
• React Full Screen - React component that sets children to fullscreen using the Fullscreen API. Cross-browser compatible with hooks support for easy fullscreen implementation. (Read more) Fullscreen Api Wrapper Browser
• React Helmet - The original document head manager for React (now consider React Helmet Async for new projects), providing control over meta tags, titles, and other head elements. (Read more) Seo Meta Tags Document Head Legacy
• React Helmet Async - A thread-safe fork of React Helmet for managing document head tags in React applications, essential for SEO, social sharing, and dynamic meta tags with SSR support. (Read more) Seo Meta Tags Ssr Document Head
• React Hot Keys - React component for listening to keyboard events and defining keyboard shortcuts. Built on hotkeys.js for declarative hotkey management with keydown and keyup support. (Read more) Keyboard Shortcuts Accessibility
• React Idle Timer - A React component that triggers events when a user becomes idle or active, perfect for implementing auto-logout, session timeout warnings, and activity tracking. (Read more) Idle Detection Activity Tracking Timeout Hooks
• React Infinite Scroll Hook - React hook for implementing infinite scroll functionality using IntersectionObserver. Works with both window scroll and scrollable containers with minimal setup. (Read more) Infinite Scroll Hooks Performance
• React Intl - Internationalize React apps with FormatJS. Provides React components and API for formatting dates, numbers, strings, and plurals. Part of the FormatJS suite with complete i18n support including ICU message syntax and locale data. (Read more) I18n Internationalization Localization Translation
• React Media - A CSS media query component for React that renders different content based on screen size, providing responsive behavior with component-based API. (Read more) Media Queries Responsive Breakpoints Conditional Rendering
• React Page Visibility - A React hook and component for detecting when a page becomes visible or hidden, useful for pausing/resuming activities and optimizing resource usage. (Read more) Hooks Visibility Performance Optimization
• React Responsive - Media query and responsive layout helper for React with CSS-in-JS support. Provides hooks and components for building responsive interfaces. (Read more) Responsive Media Queries Layout
• React Router Sitemap - Generate sitemap.xml files from React Router configuration. Automatically creates SEO-friendly sitemaps by filtering paths and replacing dynamic params. (Read more) Sitemap Seo Routing
• React Share - Social media share buttons and share counts for React, supporting major platforms with customizable buttons, icons, and tracking for viral content distribution. (Read more) Social Sharing Share Buttons Social Media Viral
• React Stripe.js - Official React components for Stripe.js and Elements. Enables seamless payment integration in React applications with pre-built, customizable payment UI components. Includes support for payment intents, subscriptions, and all Stripe payment methods. (Read more) Payments Stripe E Commerce Checkout
• React Testing Library - Testing utility for React with DOM queries and utilities for writing user-centric tests. Encourages testing components as users would interact with them. (Read more) Testing Utilities Quality Assurance
• react-device-detect - Detect device type and browser information in React applications. Provides components and hooks to detect mobile, tablet, desktop, browser type, OS, and more. Useful for responsive design, analytics, and device-specific features. (Read more) Device Detection Browser Mobile Responsive
• react-ga4 - React Google Analytics 4 module. Provides React components and hooks for integrating Google Analytics 4 with easy-to-use API for tracking pageviews, events, and custom dimensions. Supports both Universal Analytics and GA4. (Read more) Analytics Google Analytics Tracking Ga4
• react-remove-scroll - Remove page scroll while keeping scrollbar width for modals and overlays. Prevents body scrolling when modals are open while avoiding layout shifts. Essential for accessible, professional modal implementations in React applications. (Read more) Scroll Modal Overlay Accessibility
• Sentry for React - One of the most powerful tools for tracking, debugging, and resolving production issues in React applications with automatic error boundaries and detailed stack traces. (Read more) Error Tracking Monitoring Debugging
• tailwind-merge - A utility function to efficiently merge Tailwind CSS classes, automatically resolving conflicts by keeping only the last class when multiple classes target the same CSS property. (Read more) Tailwind Utilities Styling
• TanStack Query DevTools - Developer tools for TanStack Query (React Query) allowing visualization and interaction with the query cache, helping debug data fetching in React applications. (Read more) Devtools Debugging Query

Accessibility

• React Focus Lock - Trap focus inside a component for accessibility and modal dialogs. Prevents keyboard navigation from leaving a specified container, essential for accessible modals, dropdowns, and overlays. Includes auto-focus and return focus features. (Read more) Accessibility Focus Modal Keyboard

Custom Hooks

• Ahooks - Enterprise-focused React hooks library with 50+ production-ready hooks designed for common patterns in enterprise applications. Emphasizes code reusability, simplicity, and maintainability with exceptional documentation. (Read more) Hooks Enterprise Typescript
• React Firebase Hooks - React hooks for Firebase services including Authentication, Firestore, Storage, and Realtime Database. Simplifies Firebase integration with automatic subscription management and loading/error states. TypeScript support included. (Read more) Firebase Hooks Database Authentication
• React Use - Comprehensive collection of essential React hooks for common use cases including async operations, side effects, forms, and lifecycle management. Provides battle-tested utilities with full TypeScript support and extensive documentation. (Read more) Hooks Utilities Open Source
• React Waypoint - Execute a callback when a component enters or leaves the viewport. Perfect for lazy loading, infinite scrolling, animations on scroll, and analytics tracking. Lightweight alternative to Intersection Observer API with React integration. (Read more) Scroll Viewport Lazy Load Infinite Scroll
• react-use-measure - A React hook for measuring element sizes and positions using ResizeObserver. Provides accurate, performant measurements of DOM elements with support for debouncing and polyfills. Perfect for responsive components and animations. (Read more) Hooks Resize Observer Measurements
• react-use-websocket - React Hook for WebSocket communication. Simplifies WebSocket integration in React applications with automatic reconnection, message queuing, and connection state management. Fully typed with TypeScript support. (Read more) Websocket Hooks Real Time Communication
• useCountdown - A simple React hook for creating countdown timers. Provides an easy-to-use interface for countdown functionality with pause, resume, and reset capabilities. Perfect for timers, auctions, events, and time-limited offers. (Read more) Countdown Timer Hooks Time
• usehooks-ts - usehooks-ts is a modern collection of over 200+ production-ready React hooks that simplify common tasks like form validation, animations, and local storage management. It provides TypeScript support and comprehensive documentation for each hook. (Read more) Custom Hooks Typescript Productivity

Developer Tools

• commitlint - Lint commit messages according to conventional commit standards. Enforces consistent commit message format for better project history and automated changelog generation. Integrates with Husky for pre-commit validation. (Read more) Git Commits Conventional Commits Changelog
• ESLint Plugin React - React-specific linting rules for ESLint. Enforces best practices, catches common mistakes, and improves code quality in React applications. Includes rules for hooks, JSX, props, and component patterns with extensive configuration options. (Read more) Eslint Linting Code Quality Best Practices
• ESLint Plugin React Hooks - Official ESLint plugin for React Hooks. Enforces the Rules of Hooks to prevent bugs and ensure correct hook usage. Essential for all React applications using hooks, catches dependency array issues and hook ordering problems. (Read more) Eslint Hooks Linting Rules Of Hooks
• Husky - Modern native Git hooks made easy. Automatically run linting, testing, and formatting before commits and pushes. Essential for maintaining code quality and preventing bad commits in React projects with minimal configuration. (Read more) Git Hooks Pre Commit Code Quality
• lint-staged - Run linters and formatters on git staged files only. Speeds up pre-commit checks by processing only changed files. Perfect companion to Husky for efficient code quality checks in React projects without slowing down commits. (Read more) Git Linting Pre Commit Performance
• Prettier - Opinionated code formatter with support for JavaScript, TypeScript, JSX, and more. Automatically formats code to ensure consistent style across your React project. Integrates with editors and CI/CD for automatic formatting. (Read more) Formatting Code Style Tooling Dx
• React Docgen - Extract information from React components for documentation generation. Analyzes React components to extract propTypes, defaultProps, and JSDoc comments. Essential tool for automatically generating component documentation and type information. (Read more) Documentation Props Types Generator
• React Refresh - Fast Refresh implementation for React applications. Enables instant feedback during development by preserving component state during edits. Built into Create React App and Next.js, provides the best DX for React development. (Read more) Hmr Hot Reload Development Dx
• react-docgen-typescript - A tool to generate documentation from TypeScript React components. Extracts component props, types, and JSDoc comments with full TypeScript support. Seamlessly integrates with Storybook and documentation generators for type-safe component documentation. (Read more) Typescript Documentation Props Storybook
• react-error-overlay - The error overlay used in Create React App for displaying runtime errors and warnings. Provides a user-friendly error display during development with source code snippets and stack traces. Can be integrated into custom React development setups. (Read more) Errors Development Debugging Dx
• Storybook - The industry-standard workshop for building UI components in isolation. Storybook provides a sandbox to develop, test, and document React components independently from your app. Includes addons for accessibility, testing, and design integration. (Read more) Component Library Documentation Ui Development Testing

Drag & Drop

• React DnD HTML5 Backend - The official HTML5 backend for React DnD, enabling drag and drop functionality using the HTML5 drag and drop API. Provides seamless integration with React DnD for building complex drag and drop interfaces with native browser support. (Read more) Drag Drop Html5 Backend Dnd

File Upload

• Bytescale Upload Widget - A production-ready file upload widget for React with built-in cloud storage, image cropping, video previews, drag-and-drop, and comprehensive file processing capabilities. (Read more) File Upload Cloud Storage Image Cropping Video Preview
• React Drag Drop Files - Light React library for drag and drop files and images styled by styled-components. Provides a flexible, customizable file upload interface with drag-and-drop support. (Read more) Drag Drop File Upload Images
• React Dropzone Uploader - A customizable file dropzone and uploader for React with detailed file metadata, upload progress tracking, and support for cancellation and restart. (Read more) File Upload Dropzone Progress
• React FilePond - A flexible and elegant file upload component that supports drag-and-drop, image previews, optimization, and direct uploads to cloud services with a beautiful user interface. (Read more) File Upload Drag Drop Image Optimization Cloud Upload
• Uppy - A sleek, modular JavaScript file uploader that integrates seamlessly with any application, featuring a plugin system for comprehensive file upload functionality. (Read more) File Upload Modular Drag Drop

Layout

• React Split Pane - A resizable split pane component for React that allows users to adjust panel sizes with a draggable divider, supporting horizontal and vertical layouts. (Read more) Split Pane Resizable Layout Panels

Pagination

• React Responsive Pagination - Accessible responsive React pagination component that intelligently renders to available width. Works perfectly with Bootstrap without additional styles for React 19, 18, 17, and 16. (Read more) Pagination Responsive Accessible

Routing

• TanStack Router - A fully type-safe router for React with automatic code splitting, intelligent preloading, integrated caching, and comprehensive devtools, weighing ~45KB. (Read more) Routing Type Safe Code Splitting
• use-react-router-breadcrumbs - React hook for generating breadcrumbs from React Router routes. Supports dynamic routes, custom breadcrumb names, and easy integration with routing. (Read more) Breadcrumbs Navigation React Router
• Wouter - A minimalist routing solution for React with a tiny footprint (~1.5KB), offering a simple hook-based API as a lightweight alternative to React Router. (Read more) Routing Lightweight Hooks

Testing

• Cypress - Fast, easy, and reliable testing for anything that runs in a browser. Cypress provides a complete end-to-end testing experience with time-travel debugging, automatic waiting, and real-time reloads. Includes component testing for React applications. (Read more) E2e Testing Automation Component Testing
• Playwright - Microsoft's modern end-to-end testing framework for web applications. Enables reliable testing across Chrome, Firefox, and Safari with a single API. Features auto-waiting, web-first assertions, and powerful debugging tools for React applications. (Read more) E2e Testing Automation Cross Browser
• Vitest - A blazing fast unit test framework powered by Vite. Offers Jest-compatible API with native ESM support, TypeScript out of the box, and instant hot module replacement. Perfect for modern React applications using Vite. (Read more) Testing Vite Unit Tests Jest Compatible

UI Component Libraries

• prime-react - The Most Complete React UI Component Library with over 100 components, designed for enterprise applications development with focus on performance and modern UI requirements. (Read more) Open Source Enterprise Primefaces
• shadcn-ui - Beautifully designed React components built using Radix UI and Tailwind CSS (Read more) Open Source Tailwind Css Radix Ui
• tailframes-react-components - Open-source React components styled with Tailwind CSS for building responsive and modern web interfaces. Includes 40+ pre-designed UI elements. (Read more) Open Source Tailwind Css React Components
• untitled-ui-react - Open-source React UI component library built with Tailwind CSS and React Aria, offering a comprehensive collection of pre-designed components for rapid development. (Read more) Open Source Tailwind Css React Aria

™️ Legal

All product names, logos, and brands are the property of their respective owners. All company, product, and service names used in this repository, related repositories, and associated websites are for identification purposes only. The use of these names, logos, and brands does not imply endorsement, affiliation, or sponsorship.

This directory may include content generated by artificial intelligence (AI). While efforts have been made to ensure the accuracy and reliability of the information, we make no representations or warranties of any kind, express or implied, about the completeness, accuracy, reliability, suitability, or availability of the information contained herein. Users are advised to independently verify the information before making decisions based on it.

We disclaim any responsibility for errors, omissions, or inaccuracies in the content, whether generated by humans, AI, or any other means. By using this directory, you agree to use it at your own risk and acknowledge that the information provided may not always be current or accurate.

If you believe that your intellectual property rights or other legal rights have been infringed, please contact us immediately at legal@ever.co and we will take appropriate action.

🛡️ License

Shield:

This work is licensed under a

Creative Commons Attribution-ShareAlike 4.0 International License.