UI Components

• Chart

  • react-chartist - React component for Chartist.js.
  • react-charty - [demo](https://99ff00.github.io/react-charty/) - Small but powerful interactive data viz with multiple chart types, animations, zooming, theming.
  • 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.
  • react-muze - React wrapper for [muze](https://muzejs.org/)(free data visualization library for creating exploratory data visualizations in browser, using WebAssembly)
  • Flowchart React - Flowchart & Flowchart designer for React.js.
  • chartify - React.js plugin for building animated draggable and customizable charts.
  • react-chartjs-2 - Common react charting components using Chart.js 2.0.

• Collapse

  • react-accessible-accordion - Accessible Accordion component for React.
  • react-collapse - Component-wrapper for collapse animation with react-motion.
  • react-tabbordion - [demo](https://merri.github.io/react-tabbordion) - Universal, semantic and CSS-only components for creating Accordions and Tabs.

• Custom Scrollbar

  • rc-scrollbars - [demo](https://rc-scrollbars.vercel.app/) - Customizable scrollbars with flex options and 60FPS
  • react-custom-scroll - [demo](http://rommguy.github.io/react-custom-scroll/example/demo.html) - 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.

• Editable data grid / spreadsheet

  • jqwidgets-react-grid - Filtering, Pagination, Grouping, Export to Excel, PDF, CRUD and more.
  • gigatables-react - Sorting, pagination/infinite scroll, global/column search, AJAX CRUD, and more.
  • revo-grid - [demo/docs](https://revolist.github.io/revogrid/) - Powerfull Data Grid for React / AngularJS / Vue / Web Components with advanced customization.
  • ReactGrid - [demo/docs](https://reactgrid.com/docs/) - Add spreadsheet-like behavior to your app
  • ag-grid - Advanced Data Grid / Data Table supporting Javascript / React / AngularJS / Web Components.

• Form Components

  • DevExtreme React Scheduler - High-performance plugin-based scheduler/calendar for Material Design.
  • jQWidgets Scheduler - Feature complete Scheduling library.
  • interweave-emoji-picker - A React based emoji picker powered by Interweave and Emojibase.
  • date-range-picker - [demo](https://almogtavor.github.io/date-range-picker/) - A calendar component that supports date, range & ranges picks.
  • react-datepicker - A simple and reusable datepicker component for React.
  • react-datepicker2 - [demo](https://mberneti.github.io/react-datepicker2/) - [docs](https://mberneti.github.io/react-datepicker2/) A simple and reusable datepicker component (with persian jalali calendar support).
  • react-day-picker - Flexible date picker for React.
  • react-nice-dates - [demo/docs](https://reactnicedates.hernansartorio.com/) A responsive, touch-friendly, and modular date picker library.
  • react-simple-timefield - [demo](https://antonfisher.com/react-simple-timefield/) - Simple time input field.
  • react-timezone-select - [demo](https://ndom91.github.io/react-timezone-select/) - Dynamic, succinct timezone select. Based on `react-select`.
  • react-yearly-calendar - React.js Yearly Calendar Component.
  • react-calendar - Ultimate calendar for your React app.
  • react-date-picker - A date picker for your React app.
  • react-payment-inputs - [demo](https://medipass.github.io/react-payment-inputs/?path=/story/usepaymentinputs--basic-no-styles) - A zero-dependency container to help with payment card input fields.
  • react-input-mask - [demo](http://sanniassin.github.io/react-input-mask/demo.html) - Yet another react component for input masking.
  • @lunasec/react-sdk - [docs](https://www.lunasec.io/docs/) - Secure, hardened form components that encrypt/tokenize all data automatically.
  • react-numpad - [demo](https://gpietro.github.io/react-numpad-demo/) - Extensible number pad control for numbers, dates and times.
  • 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 - [demo](https://based-ghost.github.io/react-functional-select/) - Micro-sized & micro-optimized select component for React.js.
  • react-select-box - An accessible select box component for React.
  • react-select - A Select control built with and for React JS.
  • react-column-select - A column select component built 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.
  • @anatoliygatt/heart-switch - [demo](https://codesandbox.io/s/demo-for-anatoliygatt-heart-switch-cds5p) - A fully themeable and accessible heart-shaped toggle switch component.
  • react-ios-switch - React switch component.
  • react-radio-group - Better radio buttons.
  • react-autocomplete-input - Autocomplete input field for React.
  • rich-textarea - A textarea to colorize, highlight, decorate texts and offer autocomplete.
  • @pathofdev/react-tag-input - [demo & docs](https://pathof.dev/projects/react-tag-input) - Minimal tagging component with editable tags
  • react-tagsinput - A simple react component for inputing tags.
  • react-tokeninput - Tokeninput component for React.
  • react-input-autosize - Auto-resizing input field for React.
  • react-awesome-stars-rating - [demo](https://react-awesome-stars-rating.herokuapp.com/) - 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-drag-sizing - "Drag to resize" (sizing) as React Component.
  • react-dragula - Drag and drop so simple it hurts.
  • 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.
  • 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.
  • edtr-io - [demo](https://edtr.io/) - [docs](https://edtr.io/docs/getting-started) - 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 - [demo](https://uiwjs.github.io/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 [DraftJS](https://draftjs.org/).
  • react-editor - Simple richtext editor that can insert images and HTML.
  • react-medium-editor - medium-editor wrapper.
  • react-quill - Quill wrapper.
  • react-trumbowyg - [Trumbowyg](https://alex-d.github.io/Trumbowyg/) wrapper.
  • remirror - [demo](https://remirror.io/playground) - [docs](https://remirror.io/docs) - ProseMirror toolkit for React.
  • slate - [demo](http://slatejs.org/) - [docs](https://docs.slatejs.org/) - A completely customizable framework for building rich text editors.
  • smartblock - [demo](https://appleple.github.io/smartblock/) - [docs](https://appleple.github.io/smartblock/get-started) - Block based WYSIWYG editor based on ProseMirror.
  • tiptap - [demo](https://tiptap.dev/) - [docs](https://tiptap.dev/introduction) - The headless editor framework for web artisans.
  • react-simplemde-editor - React component wrapper for [EasyMDE (the most fresh SimpleMDE fork)](https://github.com/Ionaru/easy-markdown-editor).
  • react-markdown-editor - A markdown editor using React/Reflux.
  • react-md-editor - Markdown editor.
  • react-md-editor - A simple markdown editor with preview, implemented with React.js and TypeScript.
  • react-avatar-editor - Facebook-like, avatar / profile picture component.
  • 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 &agrave; la carte set of polished, extensible, and accessible inputs.
  • interweave - React library to safely render HTML, filter attributes, autowrap text with matchers, render emoji characters, and much more.
  • react-image-crop - A responsive image cropping tool for React.
  • react-avatar-generator - Generate fun kaleidoscope for user avatars.
  • react-date-range - A React component for choosing dates and date ranges.
  • react-datetime - A lightweight but complete datetime picker react component.
  • react-flatpickr - Flatpickr for React.
  • react-credit-cards - Beautiful credit cards for your payment forms.
  • react-input-color - React input color component with hsv color picker.
  • react-toggle - An elegant, accessible toggle component for React. Also a glorified checkbox.
  • react-star-rating - A simple star rating component built with React.
  • react-dropzone - Simple HTML5 drag-drop zone with React.js.
  • draft-js - A React framework for building text editors.
  • react-monacoeditor - Monaco Editor component for React.
  • react-image-cropper - Image cropper.
  • 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.
  • react-autowidth-input - Highly configurable & extensible automatically sized input field built with hooks.
  • react-big-calendar - Gcal/outlook like calendar component.
  • formsy-material-ui - A Formsy compatibility wrapper for Material-UI form components.
  • react-avatar-cropper - Aiming to be a complete solution for avatar cropping in react.
  • react-designer - Easy to configure, lightweight, editable vector graphics in your react components.
  • react-triple-toggle - ⚛️ React multi toggle component.
  • react-advanced-cropper - A react cropper library to create the cropper exactly suited for your website design.
  • react-slider - Slider component for React.
  • react-mentions - Mention people in a textarea.
  • react-textarea-autosize - &lt;textarea /&gt; component for React which grows with content.
  • react-tag-input - A fantastically simple tagging component for your React projects.
  • react-dnd - Drag and Drop for React.
  • react-draggable - React draggable component.
  • react-easy-crop - Component to crop/rotate images/videos with easy interactions. Touch friendly.

• Icons

  • react-icomoon - With react-icomoon you can easily use the icons you have selected or created in icomoon.
  • iconify-react - Over 40k icons from 50+ icon sets, including all popular icon and emoji sets.
  • react-open-doodles - Awesome free illustrations as react components.
  • react-icons - Svg react icons of popular icon packs using ES6 imports.

• Infinite Scroll

  • react-window - [demo](https://react-window.now.sh/) - React components for efficiently rendering large lists and tabular data
  • af-virtual-scroll - [demo/docs](https://af-virtual-scroll.vercel.app/docs/why) - Render large scrollable lists and tables.
  • @egjs/react-infinitegrid - [npm](https://www.npmjs.com/package/@egjs/react-infinitegrid) - [demo](https://naver.github.io/egjs-infinitegrid/storybook/) - A module used to arrange card elements including content infinitely according to various layout types.
  • react-list - A versatile infinite scroll React component.

• Loader

  • react-loader - React component that displays a spinner via spin.js until your component is loaded.
  • react-block-ui - Easy way to block the user from interacting with your UI.
  • 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).

• Map

  • pigeon-maps - [demo](https://pigeon-maps.js.org/) - ReactJS Maps without external dependencies.
  • react-geosuggest - A React autosuggest for the Google Maps Places API.
  • react-leaflet - React components for Leaflet maps.
  • react-mapbox-gl - A React binding of mapbox-gl-js.
  • react-svg-map - [demo](https://victorcazanave.github.io/react-svg-map/) - A set of components to display an interactive SVG map.
  • react-map-gl - A React wrapper for MapboxGL-js and overlay API.
  • google-map-react - Universal google map react component, allows render react components on the google map.

• Markdown Viewer

  • react-markdown - Render Markdown as React components.

• Menu

  • react-burger-menu - An off-canvas sidebar with effects and styles.
  • react-offcanvas - Off-canvas menus for React.
  • react-planet - [demo](https://innfactory.github.io/react-planet/) - Create circular menus which looks like planets.
  • hamburger-react - [demo/docs](https://hamburger-react.netlify.app/) - Animated hamburger menu icons for React.

• Miscellaneous

  • react-advanced-news-ticker - [demo](https://www.ahmetcanaydemir.com/react-advanced-news-ticker/) - A flexible and animated vertical news ticker component
  • react-awesome-query-builder - [demo](https://ukrbublik.github.io/react-awesome-query-builder/) - Visual query builder from form fields, with SQL, MongoDB and JSON export
  • react-blur - React component for blurred backgrounds.
  • fastcomments-react - [demo](<https://blog.fastcomments.com/(12-30-2019)-fastcomments-demo.html>) - FastComments component for embedding a live comment thread on a page or SPA.
  • react-simple-chatbot - [demo](https://github.com/anishagg17/PIzzaBuilder) - 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-json-tree - React JSON Viewer Component, Extracted from redux-devtools.
  • react-searchbox-awesome - [demo](https://axmz.github.io/react-searchbox-awesome-page/) - Minimalistic searchbox.
  • react-split-pane - React split-pane component.
  • react-swipe-to-delete-ios - [demo](https://arnaudambro.github.io/react-swipe-to-delete-ios/) - To delete an item in a list the same way iOS does.
  • react-swipeable-list - [demo](https://marekrozmus.github.io/react-swipeable-list/) - Configurable component to render list with swipeable items.
  • typography - A powerful toolkit for building websites with beautiful typography.
  • react-pulse-text - [demo/docs](https://kelsier90.github.io/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.
  • @restpace/schema-form - [Demo](https://restspace.io/react/schema-form/demo) - 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-facebook - Facebook components like a Login button, Like, Share, Comments, Page or Embedded Post.
  • react-pdf-viewer - [docs](https://react-pdf-viewer.dev) - A React component to view a PDF document.
  • react-resizable-and-movable - Resizable and movable component for React.
  • react-resizable-box - Resizable component for React. #reactjs.
  • react-demo-tab - [demo](https://mkosir.github.io/react-demo-tab) - A React component to easily create demos of other components.
  • react-customizable-chat-bot - [Demo](https://chithakumar13.github.io/bot-example) - Build your own chatbot matching your brand needs in minutes.

• Notification

  • cogo-toast - [demo/docs](https://cogoport.github.io/cogo-toast) - Plug and play, Promise support, inbuilt styling, ~3.5K. _(No refs / provider needed 😊)_
  • react-notifications-component - [demo](https://teodosii.github.io/react-notifications-component/) - Highly customizable and easy-to-use component for notifications.
  • react-toast - [demo](https://codesandbox.io/s/byqvk) - [docs](https://github.com/moharnadreza/react-toast/blob/main/README.md) - Minimal toast notifications.
  • react-toastify - [demo](https://fkhadra.github.io/react-toastify/) - best bet out there at the moment. Hooks support. No refs.
  • react-toast-notifications - [demo](https://jossmac.github.io/react-toast-notifications/) - pleasing toast system.
  • reapop - A React & Redux notifications system.
  • react-hot-toast - [demo](https://react-hot-toast.com/) - Smoking 🔥hot🔥 Notifications for React. Lightweight, customizable and beautiful by default.
  • simple-react-notifications - [demo](https://alexpermyakov.github.io/simple-react-notifications/) - Tiny notification library (1kb gzip).
  • notistack - [demo](https://codesandbox.io/s/github/iamhosseindhv/notistack/tree/master/examples/simple-example??hidenavigation=1&module=%2FApp.js) - [docs](https://iamhosseindhv.com/notistack/api) - Highly customizable notification snackbars (toasts) that can be stacked on top of each other

• Overlay

  • reboron - A collection of dialog animations with React.js
  • react-aria-modal - A fully accessible and flexible React modal built according WAI-ARIA Authoring Practices.
  • react-modal - Accessible modal dialog component for React.
  • react-skylight - A react component for modals and dialogs.
  • reoverlay - [demo](https://hiradary.github.io/reoverlay/) - The missing solution for managing modals.
  • sweetalert2 - [demo/docs](https://sweetalert2.github.io/) - 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

• Paginator

  • 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.