🚀 Absolutely Awesome React Components & Libraries

This is a list of AWESOME components. Nope, it's NOT a comprehensive list of every React component under the sun. So, what does "awesome" mean? Well:

• It solves a real problem
• It does so in a 🦄 unique, 🦋 beautiful, or 🏆 exceptional way. (And it's not super popular and well-known... no point in listing those.)
• It has recent code commits!

Look for a 🚀 for truly amazing projects. And look for quickie maintainer commentary and reviews in (italic parens) after some listings of note.

See also: Awesome React Frameworks.

Maintainers:

• @petebray, author of Fluxguard — monitor PROD website changes.
• @brillout, author of Vike — a fast Vite-based React framework that is flexible, lean, community-driven and dependable.

Contributing

Please review our contributing guidelines. We keep this list fresh by requiring all PRs to remove one or more non-awesome entries from this list. Please ONLY PR a new resource if you are ALSO removing one.

Table of Contents

• UI Components
  • Editable data grid / spreadsheet
  • Table
  • Infinite Scroll
  • Overlay
  • Notification
  • Tooltip
  • Menu
  • Sticky
  • Tabs
  • Loader
  • Captcha
  • Carousel
  • Buttons
  • Collapse
  • Chart
  • Command palette
  • Tree
  • UI Navigation
  • Custom Scrollbar
  • Audio / Video
  • Map
  • Time / Date / Age
  • Photo / Image
  • Icons
  • Paginator
  • Markdown Viewer
  • Canvas
  • Screenshot
  • Miscellaneous

UI Components

Back to top ⬆️

Editable data grid / spreadsheet

• AG Grid - Advanced Data Grid / Data Table supporting Javascript / React / AngularJS / Web Components.
• fortune-sheet - An online spreedsheet component that provides out-of-the-box features just like Excel.
• gigatables-react - Sorting, pagination/infinite scroll, global/column search, AJAX CRUD, and more.
• Handsontable - demo - docs - Data Grid with spreadsheet-like UI supporting React, Angular, TypeScript and JavaScript.
• jqwidgets-react-grid - Filtering, Pagination, Grouping, Export to Excel, PDF, CRUD and more.
• MUI X Data grid - demo/docs - Fast and customizable data grid with advanced features for power users and complex use cases.
• react-data-grid - Excel-like grid.
• ReactGrid - demo/docs - Add spreadsheet-like behavior to your app
• revo-grid - demo/docs - Powerfull Data Grid for React / AngularJS / Vue / Web Components with advanced customization.
• SheetXL – A high-performance spreadsheet grid. TypeScript, ESM, Node/browser, Excel-compatible functions.
• SVAR React DataGrid - demo - docs - React DataGrid with in-cell editing, tree data, context menu, virtual scrolling, etc.

Table

• ka-table - demo - Customizable table component with sorting, filtering, grouping, virtualization, editing etc.

• mantine-datatable - demo/docs - Lightweight table component for Mantine UI applications, with lots of features

• material-table - demo/docs - Built on Material UI, plus: grouping, tree data, expandable rows, export, inline editing

• mui-datatables - Built on Material UI. Search, styling, filtering, resize/hide columns, export, print, select/expand rows.

• react-data-table - demo/docs - accessible, responsive, themable, declaratively configurable table with sorting, selectable rows, expandable rows, pagination

• TanStack Table - demo - Headless UI for building powerful tables & datagrids

• react-table-library - demo - React Table Library -- an almost headless table library -- for building better tables.

• rsuite-table - demo/docs - A table component that supports virtualized.

• DevExtreme React Grid - High-performance plugin-based data grid for Bootstrap and Material Design.

• Smart React Grid - Fast and feature-complete data grid with Material Design.

Infinite Scroll

• @egjs/react-infinitegrid - npm - demo - 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 - demo/docs - Render large scrollable lists and grids.
• react-window - demo - React components for efficiently rendering large lists and tabular data
• virtua - demo - A zero-config, fast and small (~3kB) virtual list component for React, Vue and Solid.

Overlay

Display overlay / modal / alert / dialog / lightbox / popup

• react-aria-modal - A fully accessible and flexible React modal built according WAI-ARIA Authoring Practices.
• react-modal - Accessible modal dialog component for React.
• @paratco/async-modal - Simple async modal handler for React.
• reoverlay - demo - The missing solution for managing modals.
• sweetalert2 - demo/docs - 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

Notification

Toaster / snackbar — Notify the user with a modeless temporary little popup

• react-notifications-component - demo - Highly customizabl