Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

awesome-react-components

Curated List of React Components & Libraries.
https://github.com/brillout/awesome-react-components

  • @petebray
  • @brillout - plugin-ssr](https://vite-plugin-ssr.com/) (like Next.js / Nuxt but as do-one-thing-do-it-well Vite plugin) and [Telefunc](https://telefunc.com/) (remote functions instead of APIs).
  • 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 - [demo/docs](https://mui.com/x/react-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 - [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
  • jqwidgets-react-grid - Filtering, Pagination, Grouping, Export to Excel, PDF, CRUD and more.
  • ka-table - [demo](https://komarovalexander.github.io/ka-table/#/overview) - Customizable table component with sorting, filtering, grouping, virtualization, editing etc.
  • mantine-datatable - [demo/docs](https://icflorescu.github.io/mantine-datatable/) - Lightweight table component for Mantine UI applications, with lots of features
  • material-table - [demo/docs](https://material-table.com/) - 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](https://jbetancur.github.io/react-data-table-component/?) - accessible, responsive, themable, declaratively configurable table with sorting, selectable rows, expandable rows, pagination
  • TanStack Table - [demo](https://tanstack.com/table/v8/docs/examples/react/basic) - Headless UI for building powerful tables & datagrids
  • react-table-library - [demo](https://react-table-library.com/) - React Table Library -- an almost headless table library -- for building better tables.
  • rsuite-table - [demo/docs](http://rsuite.github.io/rsuite-table/) - A table component that supports virtualized.
  • sematable - Client side sorting, pagination, and text filter for redux/react based apps.
  • 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.
  • KendoReact Grid - Powerful data grid component with 100+ ready-to-use features like paging, sorting, export to Excel, and more.
  • Material-React-Table - A fully featured Material UI V5 implementation of TanStack React Table V8, written from the ground up in TypeScript
  • AG Grid - Advanced Data Grid / Data Table supporting Javascript / React / AngularJS / Web Components.
  • @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-lazyload - Lazyload your Component, Image or anything matters the performance.
  • react-list - A versatile infinite scroll React component.
  • @af-utils/virtual - [demo/docs](https://af-utils.com/virtual) - Render large scrollable lists and grids.
  • react-window - [demo](https://react-window.now.sh/) - React components for efficiently rendering large lists and tabular data
  • virtua - [demo](https://inokawa.github.io/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 - [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
  • react-notifications-component - [demo](https://teodosii.github.io/react-notifications-component/) - Highly customizable and easy-to-use component for notifications.
  • 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
  • react-local-toast - [demo](https://react-local-toast.netlify.app/showcase/) - [docs](https://react-local-toast.netlify.app/tutorial) - show feedback linked to particular component instead of app-wide toasts.
  • 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.
  • reapop - A React & Redux notifications system.
  • simple-react-notifications - [demo](https://alexpermyakov.github.io/simple-react-notifications/) - Tiny notification library (1kb gzip).
  • react-hot-toast - [demo](https://react-hot-toast.com/) - Smoking hot Notifications for React. Lightweight, customizable and beautiful by default.
  • Sonner - An opinionated toast component for React.
  • react-tooltip - React tooltip component.
  • hamburger-react - [demo/docs](https://hamburger-react.netlify.app/) - 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 - [demo](https://innfactory.github.io/react-planet/) - Create circular menus which looks like planets.
  • mantine-contextmenu - [demo/docs](https://icflorescu.github.io/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).
  • @egjs/react-flicking - [npm](https://www.npmjs.com/package/@egjs/react-flicking) - [demo](https://naver.github.io/egjs-flicking/) - It's reliable, flexible and extendable carousel.
  • react-awesome-slider - [demo](https://fullpage.caferati.me/) - 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 - [demo](https://skozer.github.io/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 - [demo](https://keen-slider.io/examples/#examples) - Performant carousel/slider with native touch/swipe behavior.
  • swiper - [demo](https://swiperjs.com/demos) - [docs](https://swiperjs.com/react) - The most modern free mobile touch slider with hardware accelerated transitions and amazing native behavior.
  • react-awesome-button - [demo](https://caferati.me/demo/react-awesome-button) - 3D animated 60fps buttons with load progress and social share actions.
  • reactive-button - [demo](https://arifszn.github.io/reactive-button/docs/playground) - [docs](https://arifszn.github.io/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 - [demo](https://merri.github.io/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-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-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 - Semiotic is a data visualization framework for React.
  • DevExtreme React Chart - High-performance plugin-based chart for Bootstrap and Material Design.
  • Smart React Chart - Feature complete Charting library.
  • 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.
  • react-dashboard - Isomorphic Dashboards.
  • cmdk - Fast, composable, unstyled command menu for React.
  • kbar - [demo](https://kbar.vercel.app) - Fast, portable, and extensible cmd+k interface.
  • react-arborist - [demo](https://react-arborist.netlify.app/) - A Full-Featured Tree View: headless, virtualized, multi-selectable, drag-n-drop, keyboard navigation, search
  • react-complex-tree - [demo](https://rct.lukasbach.com/) - [docs](https://rct.lukasbach.com/docs/getstarted) - 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 - [demo](https://he-tree-react.phphe.com/v1/examples) - [docs](https://he-tree-react.phphe.com/) - 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 - [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.
  • 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 - [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-map-gl - A React wrapper for MapboxGL-js and overlay API.
  • react-svg-map - [demo](https://victorcazanave.github.io/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 `*** time ago` statement. eg: '3 hours ago'.
  • react-google-flight-datepicker - Google flight date picker implemented in ReactJS.
  • lightGallery - [demo](https://www.lightgalleryjs.com/) - [docs](https://www.lightgalleryjs.com/docs/react/) - Full-featured lightbox gallery component.
  • react-compare-image - [demo](https://react-compare-image.yuuniworks.com/) - React component to compare two images using a slider.
  • react-image-gallery - Responsive image gallery, carousel, image slider react component.
  • yet-another-react-lightbox - [demo](https://yet-another-react-lightbox.com/examples) - [docs](https://yet-another-react-lightbox.com/documentation) - React lightbox component.
  • react-intense - A React component for viewing large images up close.
  • react-photo-album - [demo](https://react-photo-album.com/examples) - [docs](https://react-photo-album.com/documentation) - Responsive React Photo Gallery.
  • react-svg-pan-zoom - A React component that adds pan and zoom features to SVG.
  • react-particle-image - [demo](https://malerba118.github.io/react-particle-image-demo/) - 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 - [demo](https://willnguyen1312.github.io/zoom-image/examples/react.html) - [docs](https://willnguyen1312.github.io/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.
  • tabler-icons-react - 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 - [Demo](https://stepper.tkwant.de/) - 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 - [Demo](https://vinoth.info/react-sketch-canvas/?path=/story/*) 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.
  • puck - [demo](https://puck-editor-demo.vercel.app/edit) - The self-hosted visual editor for React
  • procaptcha - [demo](https://prosopo.io/) - [docs](https://docs.prosopo.io/) - Privacy focused free CAPTCHA
  • react-advanced-news-ticker - [demo](https://www.ahmetcanaydemir.com/react-advanced-news-ticker/) - A flexible and animated vertical news ticker component
  • react-avatar-generator - Generate fun kaleidoscope for user avatars.
  • 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.
  • react-demo-tab - [demo](https://mkosir.github.io/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 - [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-pdf-viewer - [docs](https://react-pdf-viewer.dev) - A React component to view a PDF document.
  • 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-mouse-select - [Demo](https://andreizanik.github.io/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 - [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.
  • react-customizable-chat-bot - [Demo](https://chithakumar13.github.io/bot-example) - Build your own chatbot matching your brand needs in minutes.
  • @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-mrz-scanner - A React component to scan MRZ on passports, visa cards, etc. It is based on Dynamsoft Label Recognizer.
  • date-range-picker - [demo](https://almogtavor.github.io/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 - [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`.
  • DevExtreme React Scheduler - High-performance plugin-based scheduler/calendar for Material Design.
  • jQWidgets Scheduler - 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: https://schedule-x.dev/
  • 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 - [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-multi-email - [demo](https://react-multi-email.vercel.app/) - 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 - [demo](https://based-ghost.github.io/react-functional-select/) - Micro-sized & micro-optimized select component for React.js.
  • react-mobile-picker - [demo](https://react-mobile-picker.vercel.app/) - 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 - [demo](https://react-select-search.com/) - 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 - [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-toggle - An elegant, accessible toggle component for React. Also a glorified checkbox.
  • ui-switch - The most complete _Toggle_ 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 - [demo & docs](https://yaireo.github.io/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 - &lt;textarea /&gt; component for React which grows with content.
  • react-rating - [demo](https://react-rating.onrender.com/) - Zero-dependency, highly customizable rating component.
  • 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-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 - [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-monacoeditor - Monaco Editor component for React.
  • react-simple-code-editor - Simple no-frills code editor with syntax highlighting
  • 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 - 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 `react-advanced-cropper`.
  • 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 &agrave; la carte set of polished, extensible, and accessible inputs.
  • @anatoliygatt/numeric-stepper - [demo](https://codesandbox.io/s/demo-for-anatoliygatt-numeric-stepper-mllfyl) - 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 - [demo](https://1czo5.csb.app/) - [docs](https://paol-imi.github.io/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 - [demo/docs](https://www.allaneagle.com/react-spaces/demo/) - 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 - [demo](https://umeshmk.github.io/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 - [demo](https://codesandbox.io/s/react-typewriter-example-mgyclf) - 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 - [demo/docs](https://gooey-react.netlify.app/) - The gooey effect for React, used for shape blobbing / metaballs.
  • react-voodoo - [demo/samples](https://github.com/react-voodoo/react-voodoo-samples) - Additive animation engine allowing complex android/iOs-like animations, rendering sliders on SSR, predictive inertia, multitouch, etc
  • react-parallax-component - Easiest way to add scroll parallax effect on the component.
  • react-parallax-tilt - [demo](https://mkosir.github.io/react-parallax-tilt) - Easily apply parallax tilt hover effect on components.
  • AgnosticUI - Accessible React component primitives that also work with Vue 3, Svelte, and Angular!
  • ant-design - [demo/docs](https://ant.design/docs/react/introduce) - A UI Design Language from China. Individual [components](http://react-component.github.io/) available.
  • atlaskit - Atlassian's official UI library, with components from _badge_ to _tree table_.
  • base web - Base Web is a foundation for initiating, evolving, and unifying web products.
  • carbon - [demo/docs](https://www.carbondesignsystem.com/) - A design system built by IBM.
  • cdbreact - [demo](https://www.devwares.com/product/contrast) - [docs](https://www.devwares.com/docs/contrast/react/index) - Elegant UI Kit library and reusable components for building mobile-first, responsive websites and web apps.
  • chakra-ui - [demo/docs](https://chakra-ui.com) - Simple, Modular & Accessible UI Components for your React Applications.
  • ChatUI - [demo/docs](https://chatui.io/) - The UI design language and React library for Conversational UI
  • CoreUI for React - [demo/docs](https://coreui.io/react) - Open Source UI components library.
  • evergreen - [demo/docs](https://evergreen.segment.com) - 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 - [demo/docs](https://pinterest.github.io/gestalt/#/) - A set of components that supports Pinterest’s design language.
  • grommet - The most advanced UX framework for enterprise applications.
  • Mantine - [demo/docs](https://mantine.dev/) - 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.
  • radix-ui - 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 - [demo/docs](https://reakit.io/docs/button/) 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 - [demo/docs](https://semi.design/) - A modern, comprehensive, flexible design system.
  • shineout - [demo](https://shine.wiki/1.4.x/en/components/GetStart) - 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.
  • Autocomplete - Accessible autocomplete, combobox, multiselect
  • Material Icons - 1,000+ SVG material icons.
  • Modal - Accessible modal dialog component.
  • Slider - Accessible slider component.
  • Table - table with sorting, selecting, pagination, virtualized.
  • Tree View - 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 React - Ionic Framework: easily build Android, Desktop and Progressive Web Apps with one code base.
  • OnsenUI - [demo/docs](https://onsen.io/v2/guide/react/) - Mobile app framework with Material and flat (iOS) designs. Based on Web Components.
  • blueprint - [demo](https://blueprintjs.com/) - [docs](https://blueprintjs.com/docs/) - UI toolkit for building complex, data-dense web interfaces for desktop (not mobile) applications.
  • dataminr-react-components - Collection of reusable React Components and utility functions.
  • shards-react - [docs/demo](https://designrevision.com/docs/shards-react/getting-started) - 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 - [demo](https://example.refine.dev) - [docs](https://refine.dev/docs) - Build data-intensive applications in no time. It ships with Ant Design System, an enterprise-level UI toolkit.
  • matrix-card - [demo](https://mehmetkaplan.github.io/matrix-card/) - Simplest possible component to generate matrix rain style cards.
  • rsuite - [demo/docs](https://rsuitejs.com/) - Suite of components for "enterprise system products".
  • lens-ui - [docs](https://github.com/luciancaetano/lens-ui/blob/main/docs/introduction.md) - 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 - [demo](https://mkosir.github.io/react-hook-mighty-mouse) - Hook that tracks mouse events on selected element.
  • react-helmet-async - Thread-safe Helmet for React 16+ and friends
  • react-helmet - A document head manager for React.
  • react-layer-stack - Simple but ubiquitously powerful and agnostic layering system for React.
  • react-portal - React component for transportation of modals, lightboxes, loading bars... to document.body.
  • react-experiments - React components for implementing UI experiments.
  • baobab-react - React integration for Baobab.
  • cerebral - A state controller with its own debugger.
  • effector-react - React bindings for effector, an effective multi-store state manager.
  • fireproof - [demo](https://fireproof.storage/try-free/) - [docs](https://use-fireproof.com/docs/welcome) Pure JS, zero dependency, CRDT database - runs in the browser and connects to any cloud or backend
  • fluxible - A pluggable container for universal flux applications.
  • kea - High level architecture for React apps.
  • react-i13n - A performant, scalable and pluggable approach to instrumenting your React application.
  • react-redux - Official React bindings for Redux.
  • redux-batched-actions - Reducer + action to reduce actions under a single subscriber notification.
  • redux - Predictable state container for JavaScript apps.
  • reselect - Selector library for Redux.
  • resourcerer - Declarative data-fetching framework for REST APIs
  • synergies - [docs](https://synergies.js.org) A performant and distributed context-state library for creating reusable React state logic by synergyzing atomar context pieces.
  • zustand - [docs](https://github.com/pmndrs/zustand) - A fast bearbones state-management solution using simplified flux principles and boilerplate-free hook api.
  • teaful - Tiny, easy and powerful React state management
  • data-driven-forms - A declarative way for building forms with all the functionality.
  • formik - Build forms without tears and supports Validation in ease.
  • formsy-react - A form input builder and validator for React JS.
  • Phormal - [Docs & Demos](https://phormal.dev/getting-started/react) - Responsive, multilingual forms with built-in validation, support for dark mode and right-to-left languages.
  • react-hook-form - React hooks for form validation without the hassle.
  • react-jsonschema-form - A React component for building Web forms from JSONSchema.
  • react-client-validation - Simple and super lightweight validation for React.
  • react-final-form - Subscription-based form state management
  • react-formawesome - Complex library for creating awesome forms.
  • surveyjs - The advanced Survey and Form library
  • Formily - High performance, extensible, and Typescript friendly
  • hook-form-react - [docs](https://luoanb.github.io/hook-form-react) - A lightweight, dependency-free solution React hooks for form validation.
  • react-router-component - Declarative router component for React.
  • react-router-scroll - React Router scroll management.
  • react-router - A complete routing library for React.
  • redux-first-history - Redux First History - Redux history binding support react-router - @reach/router - wouter
  • universal-router - A simple middleware-style router for isomorphic JavaScript web apps.
  • wouter - A minimalist-friendly ~1.3KB routing library. Nothing else but hooks.
  • tanstack-router - Type-safe router with built-in caching & URL state management
  • react-refetch - A simple, declarative, and composable way to fetch data for React components.
  • redux-connect - Provides decorator for resolving async props in react-router.
  • axios-react - HTTP client component for React.
  • apollo-client - A simple caching client for any GraphQL server and UI framework.
  • react-relay - Relay is a JavaScript framework for building data-driven React applications.
  • query - [docs](https://tanstack.com/query/v4) Powerful asynchronous state management, server-state utilities and data fetching for TS/JS, React, Solid, Svelte and Vue.
  • aesthetic - A powerful type-safe, framework agnostic, CSS-in-JS library for styling components, whether it be plain objects, importing stylesheets, or simply referencing external class names.
  • aphrodite - It&#39;s inline styles, but they work!.
  • inline-style-prefixer - Run-time Autoprefixer for Inline Style Objects.
  • react-container-query - Modular responsive component.
  • react-responsive - Media queries in react for responsive design.
  • reactponsive - Responsive components and hooks.
  • styled-components - Visual primitives for the component age.
  • stitches - CSS-in-JS with near-zero runtime, SSR, multi-variant support.
  • jsx-control-statements - Neater If and For for React JSX.
  • hypernova - A service for server-side rendering your JavaScript views.
  • isomorphic-style-loader - Isomorphic CSS style loader for Webpack.
  • react-server - React framework with server render for blazing fast page load.
  • rill - Universal web application framework.
  • webpack-isomorphic-tools - Server-side rendering for your Webpack-built applications (e.g. React).
  • create-react-app - Create React apps with no build configuration.
  • crisp-react - Express integration in TypeScript with support for multiple SPAs and pitfall avoidance.
  • cra-template-redux-auth-starter - A Redux auth starter boilerplate for CRA.
  • electron-react-boilerplate - Live editing development on desktop app.
  • elegant - [docs](https://www.elegantframework.com/docs/installation) - [demo](https://www.elegantframework.com/) - A simple React framework for rapidly building beautiful and expressive web applications with Next.js, Tailwind CSS, and Markdown loading.
  • extensive-react-boilerplate - Boilerplate with Next.js, Auth (Sign in, Sign up, Reset password, Confirm email, Refresh Token), Material UI, React Hook Form, I18N, File uploads (support local and Amazon S3 drivers), Tests, CI.
  • generator-starhackit - Full-stack starter kit.
  • nwb - CLI tool and devDependency for React apps &amp; components and npm modules.
  • nx - Next generation build system with first class monorepo support and powerful integrations.
  • PBandJ - Zero-Config Reusable Component Framework.
  • react-hot-boilerplate - Minimal live-editing boilerplate for your next ReactJS project.
  • rockpack - Simple solution for creating React application with SSR, bundling, linting, testing within 5 minutes.
  • create-react-dependency - Create react dependencies with no build configuration.
  • phoenix - A simple boilerplate that helps you make your react application with Server Side Rendering & Localization support.
  • react-enterprise-starter-kit - Highly Scalable and Performant Awesome React Starter Kit for an enterprise application with a very easy maintainable codebase.
  • react-inlinesvg - An SVG loader component for ReactJS.
  • react-godfather - A new way to write Functional Components, without Hooks.
  • redux-auth-patch - Complete token authentication system for react + redux that supports isomorphic rendering.
  • redux-search - Redux bindings for client-side search.
  • tcomb-react - Alternative syntax for PropTypes.
  • react-universal-hooks - :tada: support react hooks everywhere (Functional or Class Component).
  • qrcode.react - A &lt;QRCode/&gt; component for use with React.
  • `<qr-code>` - dependencies, customizable, animate-able, SVG-based `<qr-code>` element.
  • react-children-utilities - Extended utils for React.Children.
  • react-media - A CSS media query component for React.
  • react-middle-ellipsis - [demo](https://bluepeter.github.io/react-middle-ellipsis/) - Truncate long strings in the middle instead of the end.
  • react-translate-component - Multi-lingual/localized text content.
  • react-i18next - Internationalization for react done right. Using the i18next i18n ecosystem.
  • react-intl - Internationalize React apps.
  • react-localized - Internationalization for React components based on `gettext` format.
  • react-translate-maker - Universal internationalization (i18n) open source library for React.
  • react-intl-universal - [demo](https://g.alicdn.com/alishu/common/0.0.95/intl-example/index.html) Internationalize React apps. Not only for React.Component but also for Vanilla JS.
  • @tolgee/react - [docs](https://tolgee.io/docs/web/using_with_react/installation) – Web-based localization tool enabling users to translate directly in the React app they develop
  • js-lingui - [docs](https://lingui.js.org) – A readable, automated, and optimized (5 kb) internationalization for JavaScript.
  • backbone-react-component - A bit of nifty glue that automatically plugs your Backbone models.
  • elm-react-component - A React component which wraps an Elm module to be used in a React application.
  • gl-react - OpenGL / WebGL bindings for React to implement complex effects over images and content.
  • react-backbone - Backbone-aware mixins for react and a whole lot more.
  • react-d3-library - Open source library for using D3 in React.
  • react-elm-components - Write React components in Elm.
  • react-famous - React bridge to Famo.us.
  • react-localstorage - Simple componentized localstorage implementation for Facebook&#39;s React.
  • react-lottie-player - [demo](https://mifi.github.io/react-lottie-player/) - Declarative lottie animation player.
  • react-on-rails - Integration of React + Webpack + Rails to build Universal (Isomorphic) Apps.
  • react-three-renderer - Render into a three.js canvas using React.
  • react-threejs - Simplest bindings between React & Three.js
  • reactfire - ReactJS mixin for easy Firebase integration.
  • reactive-elements - Allows to use React.js component as HTML element (web component).
  • react-unity-webgl - Unity intergration with two-way communication using a built-in Event System.
  • react-ga - React Google Analytics Module.
  • react-google-analytics - Google analytics component.
  • react-google-autocomplete - Google Places API components and hooks.
  • react-recaptcha - A react.js reCAPTCHA for Google.
  • react-stripe-checkout - Load stripe&#39;s checkout.js as a react component. Easiest way to use checkout with React.
  • redux-segment - Segment.io analytics integration for redux.
  • react-slack-notification - Send messages and error logs to a Slack channel directly.
  • react-firebase-hooks - Hooks to integrate firebase in your application.
  • inferno - An extremely fast, React-like JavaScript library for building modern user interfaces.
  • react-fastclick - Fast Touch Events for React.
  • react-static-container - Renders static content efficiently.
  • react-perf-tool - Debug performance of your React application.
  • react-render-visualizer - Render visualizer for ReactJS.
  • react-infinite-grid - A React component which renders a grid of elements.
  • react-infinite - A browser-ready efficient scrolling container based on UITableView.
  • react-lazy-load - React component that renders children elements when they enter the viewport.
  • react-lazyload - Lazyload your Component, Image or anything matters the performance.
  • react-virtualized - React components for efficiently rendering large lists and tabular data.
  • babel-plugin-transform-react-remove-prop-types - Remove unnecessary React propTypes.
  • react-lite - An implementation of React that optimizes for small script size.
  • iSSR - The easiest way to move your React application to Server-Side Rendering. Handles Side Effects and synchronizes State.
  • react-esi - A library to boost SSR performance by exposing React components as Edge Side Includes (ESI) fragments
  • chai-enzyme - Chai.js assertions and convenience functions for testing React Components with enzyme.
  • enzyme - JavaScript Testing utilities for React.
  • jest-cli - Painless JavaScript Testing.
  • react-unit - Lightweight unit test library for ReactJS.
  • redux-test-recorder - A redux middleware to automatically generate tests for reducers through ui interaction.
  • rut - React testing made easy with `react-test-renderer`. Supports DOM and custom renderers.
  • unexpected-react - Plugin for unexpected to enable testing the full React virtual DOM, and also the shallow renderer.
  • playwright - to-end testing for modern web apps.
  • redux-devtools-chart-monitor - A chart monitor for Redux DevTools.
  • redux-devtools-dock-monitor - A resizable and movable dock for Redux DevTools monitors.
  • redux-devtools-filterable-log-monitor - Filterable tree view monitor for Redux DevTools.
  • redux-devtools-inspector - Another Redux DevTools Monitor.
  • redux-devtools-log-monitor - The default monitor for Redux DevTools with a tree view.
  • redux-devtools - DevTools for Redux with hot reloading, action replay, and customizable UI.
  • remote-redux-devtools - Redux DevTools remotely.
  • fluxguard - PROD change monitoring that highlights all DOM + design changes.
  • react-inspector - Power of Browser DevTools inspectors right inside your React app.
  • react-json-inspector - React JSON inspector component.
  • reactotron - A CLI and OS X app for inspecting your React JS and React Native apps.
  • component-controls - [demo](https://component-controls.com) - [docs](https://component-controls.com/tutorial) - A next-generation tool to create blazing-fast documentation sites.
  • cosmos-js - DX tool for designing truly encapsulated React components.
  • react-demo-tab-cli - CLI tool for creating demos of react components.
  • react-styleguidist - React style guide generator.
  • standard-react - JavaScript Standard Style Guide.
  • Plasmic - Powerful design tool for building your React components visually.
  • SimpleLocalize - Open source CLI tool for finding i18n keys in React projects.
  • react-device-frameset - React device frameset component.
  • DataFormsJS JSX Loader - Small JavaScript Compiler for quickly converting JSX to JS directly on a web page.
  • html-to-react-components - Extract annotated portions of HTML into React components as separate modules.
  • htmltojsx - Automatically AJAXify plain HTML with the power of React. It&#39;s magic!.
  • jsonx - React JSON Syntax.
  • mozaik - Moza&iuml;k is a tool based on nodejs / react / d3 / stylus to easily craft beautiful dashboards.
  • react-blessed - A react renderer for blessed.
  • jsondiffpatch-react - JSON diffing.
  • gatsby - Transform plain text into dynamic blogs and websites using React.js.
  • BCMS - API-based, open-source, self-hostable content management system for Gatsby, Nuxt and Next.
  • crisp-bigquery - Full stack Google BigQuery with Express in TypeScript.
  • react-server-routing-example - Universal client/server routing and data with AWS DynamoDB.
Programming Languages
JavaScript 245 TypeScript 222 HTML 3 MDX 2 CSS 2 SCSS 2 Java 1 CoffeeScript 1 Ruby 1 Elm 1
Keywords
react 302 javascript 79 reactjs 69 typescript 55 react-component 50 react-components 37 component 27 svg 15 css 14 hooks 14 vue 14 ui 14 redux 14 editor 14 grid 12 components 12 react-hooks 11 animation 11 table 11 datagrid 10 react-native 10 ui-components 10 chart 9 webpack 9 mobile 9 ssr 9 design-system 8 forms 8 charts 8 form 8 web 8 performance 8 bootstrap 8 state-management 8 accessible 8 drag-and-drop 8 preact 7 carousel 7 calendar 7 datatable 7 hook 7 visualization 7 nodejs 6 html 6 modal 6 angular 6 babel 6 windowing 6 d3 6 material-ui 6