awesome-react-components

, author of — monitor PROD website changes

, author of — a fast Vite-based React framework that is flexible, lean, community-driven and dependable

fortune-sheet

An online spreedsheet component that provides out-of-the-box features just like Excel

AG Grid

Advanced Data Grid / Data Table supporting Javascript / React / AngularJS / Web Components

gigatables-react

Sorting, pagination/infinite scroll, global/column search, AJAX CRUD, and more

MUI X Data grid

- Fast and customizable data grid with advanced features for power users and complex use cases

react-data-grid

Excel-like grid

revo-grid

- Powerfull Data Grid for React / AngularJS / Vue / Web Components with advanced customization

ReactGrid

- Add spreadsheet-like behavior to your app

Filtering, Pagination, Grouping, Export to Excel, PDF, CRUD and more

@egjs/react-infinitegrid

- - A module used to arrange card elements including content infinitely according to various layout types

react-lazyload

Lazyload your Component, Image or anything else where the performance matters

react-list

A versatile infinite scroll React component

@af-utils/virtual

- Render large scrollable lists and grids

react-window

- React components for efficiently rendering large lists and tabular data

virtua

- A zero-config, fast and small (~3kB) virtual list component for React, Vue and Solid

react-aria-modal

A fully accessible and flexible React modal built according WAI-ARIA Authoring Practices

react-modal

Accessible modal dialog component for React

reoverlay

- The missing solution for managing modals

sweetalert2

- A beautiful, responsive, highly customizable and accessible (WAI-ARIA) replacement for JavaScript's popup boxes. Zero dependencies

sweetalert2-react-content

Official SweetAlert2 enhancer adding support for React elements as content

react-notifications-component

- Highly customizable and easy-to-use component for notifications

- - Highly customizable notification snackbars (toasts) that can be stacked on top of each other

react-local-toast

- - show feedback linked to particular component instead of app-wide toasts

react-toast

- - Minimal toast notifications

react-toastify

🚀 - - best bet out there at the moment. Hooks support. No refs

reapop

A React & Redux notifications system

simple-react-notifications

- Tiny notification library (1kb gzip)

react-hot-toast

- Smoking hot Notifications for React. Lightweight, customizable and beautiful by default

An opinionated toast component for React

react-tooltip

React tooltip component

hamburger-react

- Animated hamburger menu icons for React

react-burger-menu

An off-canvas sidebar with effects and styles

react-offcanvas

Off-canvas menus for React

react-planet

- Create circular menus which looks like planets

mantine-contextmenu

- Context-menu hook/component for applications built with Mantine UI

react-headroom

Hide your header until you need it

react-stickynode

A performant and comprehensive React sticky

react-tabs

React tabs component

react-tabtab

React, tabs

react-loader-spinner

Collection set of react-spinner for async operation

react-redux-loading-bar

Simple Loading Bar for Redux and React

react-spinners-css

Amazing collection of react spinners components

react-spinners

A collection of loading spinner components for react

react-content-loader

SVG-Powered component to easily create placeholder loadings (like Facebook's cards loading)

react-simple-captcha

- - React Simple Captcha is a very powerful, highly customizable and easy to use captcha for React JS

procaptcha

- - Privacy focused free CAPTCHA

@egjs/react-flicking

- - It's reliable, flexible and extendable carousel

react-awesome-slider

- Fullpage, 3D animated, 60fps media and content slider/carousel

pure-react-carousel

Built from scratch and not highly opinionated

react-id-swiper

A library to use idangerous Swiper as a ReactJs component

react-instagram-zoom-slider

- A slider component with pinch to zoom capabilities inspired by Instagram

react-responsive-carousel

React.js Responsive Carousel (with Swipe)

react-slick

React carousel component

keen-slider

- Performant carousel/slider with native touch/swipe behavior

swiper

- - The most modern free mobile touch slider with hardware accelerated transitions and amazing native behavior

react-awesome-button

- 3D animated 60fps buttons with load progress and social share actions

reactive-button

- - A beautiful animated button component with progress indicator

react-accessible-accordion

Accessible Accordion component for React

react-collapse

Component-wrapper for collapse animation with react-motion

react-tabbordion

- Universal, semantic and CSS-only components for creating Accordions and Tabs

chartify

React.js plugin for building animated draggable and customizable charts

essential js 2 charts

Beautiful and interactive charts & graphs for react

echarts for react

Wrapper around beautiful Apache Echarts

jscharting-react

– React chart component offering a complete set of chart types and engaging data visualizations with

react-chartist

React component for Chartist.js

react-charty

- Small but powerful interactive data viz with multiple chart types, animations, zooming, theming

react-chartjs-2

Common react charting components using Chart.js 2.0

react-d3-components

D3 Components for React

react-dazzle

Dashboards made easy in React JS

react-google-charts

React-google-charts React component

react-highcharts

React-highcharts

react-sigmajs

Lightweight but powerful library for drawing network graphs built on top of SigmaJS

react-sparklines

Beautiful and expressive Sparklines React component

react-timeseries-charts

Declarative timeseries charts

react-vis

Data visualization library based on React and d3

recharts

Redefined chart library built with React and D3

rumble-charts

React components for building composable and flexible charts

victory

Data viz for React

Semiotic is a data visualization framework for React

High-performance plugin-based chart for Bootstrap and Material Design

Feature complete Charting library

react-muze

React wrapper for (free data visualization library for creating exploratory data visualizations in browser, using WebAssembly)

Flowchart React

Flowchart & Flowchart designer for React.js

react-dashboard

Isomorphic Dashboards

Fast, composable, unstyled command menu for React

kbar

- Fast, portable, and extensible cmd+k interface

react-arborist

- A Full-Featured Tree View: headless, virtualized, multi-selectable, drag-n-drop, keyboard navigation, search

react-complex-tree

- - Unopinionated Accessible Tree Component with Multi-Select, Drag-And-Drop and Search

react-treeview

Easy, light, flexible tree view made with React

he-tree-react

- - Tree, customizable UI, flat data, tree data, drag-n-drop, placeholder for drop, foldable, checkbox, virtualized

react-scroll

React scroll component

react-swipeable-views

A React Component for binded Tabs and Swipeable Views

rc-scrollbars

- Customizable scrollbars with flex options and 60FPS

react-custom-scroll

- Easily customize the browser scroll bar with native OS scroll behavior

react-shadow-scroll

Component that customizes the image and inserts shadow when scrolling exists

react-dailymotion

Dailymotion player component for React

react-player

A react component for playing a variety of URLs, including YouTube

react-soundplayer

Create custom SoundCloud players with React

react-youtube

React.js powered YouTube player component

video-react

A web video player built for the HTML5 world using React library

material-ui-audio-player

Audio player for material ui design

react-vision-camera

Camera component for React using getUserMedia. We can use this component for computer vision tasks like barcode scanning, text recognition, etc

react-barcode-qrcode-scanner

Barcode and QR code scanner component for React. It uses react-vision-camera to access the camera and Dynamsoft Barcode Reader to read barcodes

google-map-react

Universal google map react component, allows render react components on the google map

pigeon-maps

- ReactJS Maps without external dependencies

react-geosuggest

A React autosuggest for the Google Maps Places API

react-leaflet

React components for Leaflet maps

react-map-gl

A React wrapper for MapboxGL-js and overlay API

react-svg-map

- A set of components to display an interactive SVG map

react-timeago

A simple time-ago component for ReactJs

timeago-react

Format date with statement. eg: '3 hours ago'

react-google-flight-datepicker

Google flight date picker implemented in ReactJS

lightGallery

- - Full-featured lightbox gallery component

react-compare-image

- React component to compare two images using a slider

react-image-gallery

Responsive image gallery, carousel, image slider react component

yet-another-react-lightbox

- - React lightbox component

react-intense

A React component for viewing large images up close

react-photo-album

- - Responsive React Photo Gallery

react-svg-pan-zoom

A React component that adds pan and zoom features to SVG

react-particle-image

- Render images as interactive particles

react-imgix

Add fast, responsive images as an image, picture, or background!

@frameright/react-image-display-control

Define zoom regions for smart responsive images

zoom-image

- - A little yet powerful framework agnostic library to zoom image on the web

iconify-react

Over 40k icons from 50+ icon sets, including all popular icon and emoji sets

react-icons

Svg react icons of popular icon packs using ES6 imports

react-open-doodles

Awesome free illustrations as react components

react-icomoon

With react-icomoon you can easily use the icons you have selected or created in icomoon

A set of over 450 free MIT-licensed high-quality SVG icons

Lucide

Beautiful & consistent icon toolkit made by the community. Open-source project and a fork of Feather Icons

react-paginate

A ReactJS component that creates a pagination

react-laravel-paginex

Laravel Pagination with ReactJS (customizable)

paginated

React render props & custom hook to build pagination

react-steps

- Responsive React Stepper

react-markdown

Render Markdown as React components

react-konva

React Konva is a JavaScript library for drawing complex canvas graphics with bindings to the Konva Framework

react-sketch

A Sketch tool for React based applications, backed-up by FabricJS

react-sketch-canvas

Freehand vector drawing tool for React using SVG as canvas. Accepts input from Mouse, touch, and graphic tablets

react-heat-map

A lightweight calendar heatmap react component built on SVG, customizable version of GitHub's contribution graph

html2canvas

Take screenshots of any part of your web page using Javascript

puck

- The self-hosted visual editor for React

react-advanced-news-ticker

- A flexible and animated vertical news ticker component

react-avatar-generator

Allows users to create random kaleidoscopes to be used as avatars

react-awesome-query-builder

- Visual query builder from form fields, with SQL, MongoDB and JSON export

react-blur

React component for blurred backgrounds

react-demo-tab

- A React component to easily create demos of other components

react-facebook

Facebook components like a Login button, Like, Share, Comments, Page or Embedded Post

fastcomments-react

- FastComments component for embedding a live comment thread on a page or SPA

react-pdf-viewer

- A React component to view a PDF document

react-simple-chatbot

- A simple chatbot component to create conversation chats

react-file-reader-input

File input component for control for file reading styling and abstraction

react-filter-control

The React filterbuilder component for building the filter criteria in the UI

react-headings

Auto-increment your HTML headings (h1, h2, etc.) for improved accessibility and SEO, no matter your component structure, while you keep full control of what's rendered

react-joyride

Create walkthroughs and guided tours for your ReactJS apps. Now with standalone tooltips!

react-mouse-select

A component that allows selecting DOM elements by moving the mouse

react-resizable-and-movable

Resizable and movable component for React

react-resizable-box

Resizable component for React. #reactjs

react-searchbox-awesome

- Minimalistic searchbox

react-split-pane

React split-pane component

react-swipe-to-delete-ios

- To delete an item in a list the same way iOS does

react-swipeable-list

- Configurable component to render list with swipeable items

typography

A powerful toolkit for building websites with beautiful typography

react-pulse-text

- Allows you to animate the text of any property of another component

captcha-image

Allows you to generate a random captcha image with options

react-pdf

Display PDFs in your React app as easily as if they were images

react-customizable-chat-bot

- Build your own chatbot matching your brand needs in minutes

@restpace/schema-form

- Easily build complex forms automatically from a JSON Schema

react-darkreader

A React Hook for adding a dark / night mode to your site inspired by darkreader

react-apple-signin-auth

Apple signin for React using the official Apple JS SDK

react-mrz-scanner

A React component to scan MRZ on passports, visa cards, etc. It is based on Dynamsoft Label Recognizer

date-range-picker

- A calendar component that supports date, range & ranges picks

react-big-calendar

Gcal/outlook like calendar component

react-datepicker

A simple and reusable datepicker component for React

react-day-picker

Flexible date picker for React

react-flatpickr

Flatpickr for React

react-simple-timefield

- Simple time input field

react-timezone-select

- Dynamic, succinct timezone select. Based on

High-performance plugin-based scheduler/calendar for Material Design

Feature complete Scheduling library

react-calendar

Ultimate calendar for your React app

react-date-picker

A date picker for your React app

schedule-x

Material design event calendar and date picker components. Demo site:

interweave-emoji-picker

A React based emoji picker powered by Interweave and Emojibase

react-credit-cards

Beautiful credit cards for your payment forms

react-payment-inputs

- A zero-dependency container to help with payment card input fields

react-input-mask

- Yet another react component for input masking

@lunasec/react-sdk

- Secure, hardened form components that encrypt/tokenize all data automatically

react-numpad

- Extensible number pad control for numbers, dates and times

react-multi-email

- Format multiple emails as the user types

react-autosuggest

WAI-ARIA compliant React autosuggest component

react-typeahead

Pure react-based typeahead and typeahead-tokenizer

react-aria-menubutton

A fully accessible, easily themeable, React-powered menu button

react-functional-select

- Micro-sized & micro-optimized select component for React.js

react-mobile-picker

- An iOS like select box component

react-select

A Select control built with and for React JS

react-column-select

A column select component built for react

react-select-search

- A lightweight select component for React

coloreact

A tiny Color Picker for React

react-color

Is a tiny color picker widget component for React apps

react-colorful

A tiny (2,5 KB), dependency-free, fast and accessible color picker component

react-input-color

React input color component with hsv color picker

@anatoliygatt/heart-switch

- A fully themeable and accessible heart-shaped toggle switch component

react-ios-switch

React switch component

react-toggle

An elegant, accessible toggle component for React. Also a glorified checkbox

ui-switch

The most complete component

react-slider

Slider component for React

react-radio-group

Better radio buttons

react-autocomplete-input

Autocomplete input field for React

react-mentions

Mention people in a textarea

rich-textarea

A textarea to colorize, highlight, decorate texts and offer autocomplete

react-tag-input

A fantastically simple tagging component for your React projects

react-tagsinput

A simple react component for inputing tags

react-tokeninput

Tokeninput component for React

tagify

- Lightweight, efficient Tags input component

react-input-autosize

Auto-resizing input field for React

react-autowidth-input

Highly configurable & extensible automatically sized input field built with hooks

react-textarea-autosize

<textarea /> component for React which grows with content

react-rating

- Zero-dependency, highly customizable rating component

react-awesome-stars-rating

- The star rating component with accessibility

react-star-rating-input

React.js component for entering 0-5 (or more) stars

react-beautiful-dnd

Beautiful and accessible drag and drop for lists with React

react-dnd

Drag and Drop for React

react-drag-sizing

"Drag to resize" (sizing) as React Component

react-draggable

React draggable component

react-dragula

Drag and drop so simple it hurts

react-dropzone

Simple HTML5 drag-drop zone with React.js

react-movable

Accessible and minimalistic (<4kB gzipped) library for vertical drag and drop in lists and tables

react-sortable-pane

Sortable and resizable pane component for React

neodrag

Multi-framework libraries for dragging. Choose your framework, the dragging API behavior will stay the same

react-anything-sortable

Sort any children with touch support and IE8 compatibility

sortablejs

Lists reorderable by drag-and-drop, within and among lists

alloyeditor

WYSIWYG editor based on CKEditor with completely rewritten UI

ckeditor4-react

An official CKEditor 4 rich text editor wrapper

ckeditor5-react

An official CKEditor 5 rich text editor wrapper

draft-js

A React framework for building text editors

edtr-io

- - WYSIWYG in-line web editor with plugins

megadraft

Rich Text editor built on top of draft.js

react-ace

Ace (Advanced Code Editor) wraper

react-codemirror

- CodeMirror component for React

react-contenteditable

React component for a div with editable contents

react-draft-wysiwyg

WYSIWYG editor build on top of

react-editor

Simple richtext editor that can insert images and HTML

react-medium-editor

medium-editor wrapper

react-monacoeditor

Monaco Editor component for React

react-simple-code-editor

Simple no-frills code editor with syntax highlighting

react-quill

Quill wrapper

react-trumbowyg

wrapper

remirror

- - ProseMirror toolkit for React

slate

- - A completely customizable framework for building rich text editors

smartblock

- - Block based WYSIWYG editor based on ProseMirror

tiptap

- - The headless editor framework for web artisans

react-simplemde-editor

React component wrapper for

react-markdown-editor

A markdown editor using React/Reflux

react-md-editor

A simple markdown editor with preview, implemented with React.js and TypeScript

react-avatar-editor

Facebook-like, avatar / profile picture component

react-avatar-generator

Generate fun kaleidoscope for user avatars

react-easy-crop

Component to crop/rotate images/videos with easy interactions. Touch friendly

react-image-crop

A responsive image cropping tool for React

react-image-cropper

Image cropper

react-advanced-cropper

A react cropper library to create the cropper exactly suited for your website design

react-mobile-cropper

A ready-to-use image cropping library highly inspirited by popular Android croppers. Based on

formsy-material-ui

A Formsy compatibility wrapper for Material UI form components

formsy-react-components

A set of React JS components for use in a formsy-react form

react-input-enhancements

Set of enhancements for input control

react-widgets

An à la carte set of polished, extensible, and accessible inputs

@anatoliygatt/numeric-stepper

- A fully themeable and accessible numeric stepper component

interweave

React library to safely render HTML, filter attributes, autowrap text with matchers, render emoji characters, and much more

react-designer

Easy to configure, lightweight, editable vector graphics in your react components

react-upload-gallery

React for Upload Image Gallery. Drag & Drop, Sortable, Customize

react-syntax-highlighter

Syntax highlighting component with Prismjs or Highlightjs AST using inline styles

autoresponsive-react

Auto responsive grid layout library

golden-layout

A multi-screen JavaScript Layout manager

hedron

A no-frills flexbox grid system, powered by styled-components

m-react-splitters

Splitter component, written in TypeScript

muuri-react

- - Responsive, sortable, filterable and draggable grid layouts

react-grid-layout

A draggable and resizable grid layout with responsive breakpoints, for React

react-masonry-component

Wrapper for @desandro's Masonry

react-reflex

Flex layout container component for advanced React web applications

react-spaces

- Nestable anchored, resizable, scrollable components

react-stonecutter

Animated grid layout component

react-colrow

Responsive grid layout components. Based on css flexbox. Support fraction width, auto grow

react-schematic

- Build responsive layouts using styled schematics without an overhead of any theme configuration

data-driven-motion

Easily animate your data

react-animatable

An animation library using Web Animations API

react-anime

A super easy animation library

react-flip-move

Effortless animation between DOM changes (eg. list reordering) using the FLIP technique

react-gsap-enhancer

Use the full power of React and GSAP together

react-tsparticles

A lightweight component to easily create interactive particles animations

react-motion

A spring that solves your animation problems

react-mt-svg-lines

Wrapper to animate the line stroke in SVGs

react-router-transition

Transitions built for react-router, powered by react-motion

react-spring

A spring physics based animation library

react-ts-typewriter

- Easy to use and customizable typewriter effect for any text

framer-motion

An animation and gesture library

react-spark-scroll

Scroll-based actions and animations for react

react-track

Track the position of DOM elements. Create cool animations

react-transitive-number

Apply transition effect to numeric strings, a la old Groupon timers

react-web-animation

React components for the Web Animations API -

auto-size-transition

A component that scale dynamically according to the internal children size

react-particles-bg

Particles backgrounds

gooey-react

- The gooey effect for React, used for shape blobbing / metaballs

react-voodoo

- Additive animation engine allowing complex android/iOs-like animations, rendering sliders on SSR, predictive inertia, multitouch, etc

simple-parallax-js

- The easiest way to get a parallax effect with React and JavaScript on images

react-parallax-tilt

- Easily apply parallax tilt hover effect on components

Accessible React component primitives that also work with Vue 3, Svelte, and Angular!

ant-design

- A UI Design Language from China. Individual available

Atlassian's official UI library, with components from to

Base Web is a foundation for initiating, evolving, and unifying web products

carbon

- A design system built by IBM

cdbreact

- - Elegant UI Kit library and reusable components for building mobile-first, responsive websites and web apps

chakra-ui

- Simple, Modular & Accessible UI Components for your React Applications

ChatUI

- The UI design language and React library for Conversational UI

CoreUI for React

- Open Source UI components library

evergreen

- Evergreen React UI Framework by Segment

fluentui

UX frameworks for creating beautiful, cross-platform apps that share code, design, and interaction behavior

geist-ui

Modern and minimalist React UI library

gestalt

- A set of components that supports Pinterest’s design language

grommet

The most advanced UX framework for enterprise applications

Mantine

- A fully featured library with 100+ hooks and components with native dark theme support

orbit

Components for building travel oriented projects

flowbite-react

Open-source UI component library based on React, Tailwind CSS, and Flowbite

primereact

A complete UI Framework with 50+ components featuring material, bootstrap and custom themes

Unstyled, accessible components for building high‑quality design systems and web apps

react-bootstrap

Bootstrap components built with React

react-foundation

Foundation as React components

reakit

Toolkit for building accessible rich web apps

searchkit

React UI components / widgets. The easiest way to build a great search experience with Elasticsearch

semantic-ui-react

The official Semantic-UI-React integration

semi-design

- A modern, comprehensive, flexible design system

shadcn/ui

- - Beautifully designed components that you can copy and paste into your apps

shineout

- Chinese-friendly set of components: form elements, navigation, table, tree, tree select drop-down etc

Material UI

🚀 - Full suite of components. Build your own design system, or start with Material Design

Accessible autocomplete, combobox, multiselect

1,000+ SVG material icons

Accessible modal dialog component

Accessible slider component

table with sorting, selecting, pagination, virtualized

Accessible tree view component for React

react-essence

Essence - The Essential Material Design Framework

react-materialize

Material design for react, powered by materializecss

react-toolbox

A set of React components implementing Google's Material Design

mdbootstrap

React Bootstrap with Material Design

antd-mobile

Configurable Mobile UI from China

Ionic Framework: easily build Android, Desktop and Progressive Web Apps with one code base

OnsenUI

- Mobile app framework with Material and flat (iOS) designs. Based on Web Components

blueprint

- - UI toolkit for building complex, data-dense web interfaces for desktop (not mobile) applications

Collection of reusable React Components and utility functions

shards-react

- A beautiful and modern React design system. Freemium

aframe-react

Build virtual reality experiences with A-Frame and React

react-admin

Build admin user experiences on top of REST and GraphQL services

refine

- - Build data-intensive applications in no time. It ships with Ant Design System, an enterprise-level UI toolkit

matrix-card

- Simplest possible component to generate matrix rain style cards

rsuite

- Suite of components for "enterprise system products"

lens-ui

- A Suit of components focused on simplicity

react-intersection-observer

React implementation of the Intersection Observer API

react-visibility-sensor

Sensor component

react-waypoint

A React component to execute a function whenever you scroll to an element

react-component-queries

Provide props to your Components based on their Width and/or Height

react-container-dimensions

Wrapper component that detects element resize

react-dimensions

React higher-order component to get dimensions of container

react-height

Component-wrapper to determine and report children elements height

react-measure

Compute measurements of a React component

react-sizeme

Make your React Components aware of their width and height

react-hotkeys

Declarative hotkey and focus area management for React

react-key-handler

React component to handle keyboard events

react-keydown

Lightweight keydown wrapper for React components

react-shortcuts

Manage keyboard shortcuts from one place

useKeyCapture

A custom hook to ease the key-press listeners of a target/global

react-keyboard-navigator

A suite of React components and hook for selecting sibling components through the keyboard

react-scroll-components

A set of components that react to page scrolling

react-swipe

Swipe.js as a React component

react-hook-mighty-mouse

- Hook that tracks mouse events on selected element