React Components
Components are the building blocks of React apps. These projects include components that you can use in your own app.
Try filtering on the toolkit tag to see the bigger component libraries. Or check out all the text editor or calendar components.
213 Projects
Sort
material-ui
React components that implement Google's Material Design.
toolkit
material design
.
.
react-motion
A spring that solves your animation problems.
animation
.
.
draft-js
A React framework for building text editors.
text editor
.
.
react-bootstrap
Bootstrap 3 components built with React
toolkit
.
.
react-virtualized
React components for efficiently rendering large lists and tabular data
list
.
.
react-canvas
High performance <canvas> rendering for React components
graphics
.
.
redux-form
A Higher Order Component using react-redux to keep form state in a Redux store
set
form
.
.
blueprint
A React-based UI toolkit for the web
toolkit
.
.
react-native-web
React Native for Web
toolkit
.
.
NativeBase
Essential cross-platform UI components for React Native
native
.
.
react-dnd
Drag and Drop for React
.
.
formik
Build forms in React, without the tears 😭
form
.
.
react-toolbox
A set of React components implementing Google's Material Design specification with the power of CSS Modules
toolkit
material design
.
.
slate
A completely customizable framework for building rich text editors.
text editor
.
.
react-dates
An easily internationalizable, mobile-friendly datepicker library for the web
calendar
.
.
react-desktop
React UI Components for macOS High Sierra and Windows 10
toolkit
.
.
react-grid-layout
A draggable and resizable grid layout with responsive breakpoints, for React.
grid
.
.
react-native-swiper
The best Swiper component for React Native.
native
.
.
victory
A collection of composable React components for building interactive data visualizations
dataviz
.
.
react-native-gifted-chat
💬 The most complete chat UI for React Native
native
.
.
reactstrap
Simple React Bootstrap 4 components
toolkit
.
.
react-color
:art: Color Pickers from Sketch, Photoshop, Chrome, Github, Twitter & more
set
color
picker
.
.
react-slick
React carousel component
.
.
react-sortable-hoc
A set of higher-order components to turn any list into an animated, touch-friendly, sortable list ✌️
list
.
.
whs.js
:rocket: 🌪 Super-fast 3D framework for Web Applications 🥇 & Games 🎮. Based on Three.js
toolkit
3d
game
.
.
fixed-data-table
A React table component designed to allow presenting thousands of rows of data.
list
.
.
elemental
A flexible and beautiful UI framework for React.js
toolkit
.
.
react-vis
Data-Visualization oriented components
set
dataviz
.
.
react-jsonschema-form
A React component for building Web forms from JSON Schema.
set
.
.
react-autosuggest
WAI-ARIA compliant React autosuggest component
autocomplete
.
.
react-google-maps
React.js Google Maps integration component
map
.
.
grommet
Focus on the essential experience
toolkit
.
.
react-draggable
React draggable component
.
.
react-infinite-calendar
✨ Infinite scrolling date-picker built with React, with localization, range selection, themes, keyboard support, and more.
calendar
.
.
react-responsive
Media queries in react for responsive design
layout
.
.
google-map-react
Google map library for react that allows rendering components as markers :tada:
map
.
.
react-datepicker
A simple and reusable datepicker component for React
calendar
.
.
velocity-react
React components for Velocity.js
animation
.
.
draft-js-plugins
React Plugin Architecture for Draft.js including Slack-Like Emojis, FB-Like Mentions and Stickers
text editor
.
.
react-data-grid
Excel-like grid component built with React, with editors, keyboard navigation, copy & paste, and the like http://adazzle.github.io/react-data-grid/
grid
set
.
.
tcomb-form-native
Forms library for react-native
form
.
.
react-waypoint
A React component to execute a function whenever you scroll to an element.
.
.
react-chartjs
common react charting components using chart.js
dataviz
.
.
react-burger-menu
:hamburger: An off-canvas sidebar component with a collection of effects and styles using CSS transitions and SVG path animations
menu
.
.
react-flip-move
Effortless animation between DOM changes (eg. list reordering) using the FLIP technique.
animation
.
.
react-markdown
Render Markdown as React components
.
.
react-day-picker
Flexible date picker for React
calendar
.
.
react-swipeable-views
A React component for swipeable views. :snowflake:
.
.
react-big-calendar
gcal/outlook like calendar component
.
.
belle
Configurable React Components with great UX
toolkit
.
.
reactivesearch
A React and React Native UI components library for building data-driven apps with Elasticsearch
toolkit
.
.
react-notification-system
A complete and totally customizable component for notifications in React
notification
.
.
sharingbuttons.io
Quickly generate social sharing buttons with a tiny performance footprint
set
button
.
.
react-bootstrap-table
A Bootstrap table built with React.js
list
.
.
react-redux-form
Create forms easily in React with Redux.
form
.
.
react-sparklines
Beautiful and expressive Sparklines React component
.
.
react-joyride
Create walkthroughs and guided tours for your app
.
.
react-sortable-tree
Drag-and-drop sortable component for nested data and hierarchies
list
.
.
react-quill
A Quill component for React.
text editor
.
.
react-icons
svg react icons of popular icon packs
set
.
.
react-rte
Pure React rich text "WYSISYG" editor based on draft-js.
text editor
.
.
react-md
React material design
toolkit
material design
.
.
react-router-transition
painless transitions built for react-router, powered by react-motion
.
.
react-portal
React component for transportation of modals, lightboxes, loading bars... to document.body
.
.
react-custom-scrollbars
React scrollbars component
.
.
gl-react
gl-react – React library to write and compose WebGL shaders
3d
.
.
react-list
:scroll: A versatile infinite scroll React component.
list
.
.
react-d3-components
D3 Components for React
dataviz
.
.
halogen
A collection of loading spinners with React.js
spinner
.
.
nuka-carousel
Pure React Carousel Component
.
.
react-input-enhancements
Set of enhancements for input control
set
.
.
reflexbox
React flexbox layout and grid system
grid
.
.
react-native-icons
Quick and easy icons in React Native
icon
.
.
react-split-pane
React split-pane component
.
.
react-images
🌄 A lightbox component for displaying images
grid
.
.
react-codemirror
Codemirror Component for React.js
text editor
.
.
react-hotkeys
Declarative hotkey and focus area management for React
.
.
react-spinkit
A collection of loading indicators animated with CSS for React
spinner
.
.
react-treebeard
React Tree View Component. Data-Driven, Fast, Efficient and Customisable.
.
.
react-designer
Editable vector graphics in your react components.
set
.
.
autoresponsive-react
Auto Responsive Layout Library For React
grid
.
.
react-tagsinput
Highly customizable React component for inputing tags.
.
.
component-playground
A component for rendering React components with editable source and live preview
devtool
.
.
alloy-editor
WYSIWYG editor based on CKEditor with completely rewritten UI
text editor
.
.
react-stonecutter
Animated grid layout component for React
grid
.
.
React-Dropzone-Component
:camera: ReactJS Dropzone for File Uploads (using Dropzone.js)
.
.
react-headroom
Hide your header until you need it
.
.
video-react
A web video player built for the HTML5 world using React library.
video
.
.
react-pivot
React-Pivot is a data-grid component with pivot-table-like functionality for data display, filtering, and exploration.
spreadsheet
.
.
reakit
Toolkit for building interactive UIs with React
toolkit
.
.
form
React High Order Form Component(web & react-native)
form
.
.
react-copy-to-clipboard
Copy-to-clipboard React component
.
.
react-mapbox-gl
A React binding of mapbox-gl-js
map
.
.
react-cropper
Cropper as React components
.
.
react-input-mask
Input masking component for React. Made with attention to UX.
input
.
.
react-collapse
Component-wrapper for collapse animation with react-motion for elements with variable (and dynamic) height
.
.
Winterfell
Generate complex, validated and extendable JSON-based forms in React.
form
.
.
react-tags
A fantastically simple tagging component for your React projects
.
.
react-syntax-highlighter
syntax highlighting component for react with prismjs or highlightjs ast using inline styles
.
.
react-photo-gallery
React Photo Gallery
.
.
react-swipeable
React swipe component - Swipe bindings for react
.
.
react-rnd
🖱 A resizable and draggable component for React.
.
.
react-redux-loading-bar
Loading Bar (aka Progress Bar) for Redux and React
spinner
.
.
react-selectize
set
.
.
react-resizable
A simple React component that is resizable with a handle.
.
.
react-maskedinput
Masked <input/> React component
.
.
react-svg-morph
:crystal_ball: morph your svg component one into another other
set
.
.
react-typist
Typing animations with React
.
.
react-ui-tree
React tree component
.
.
React-Spreadsheet-Component
:clipboard: Spreadsheet Component for ReactJS
spreadsheet
.
.
react-timeago
A simple time-ago component for ReactJs.
.
.
react-virtual-list
Super simple virtualized list React component
list
.
.
react-mentions
@mention people in a textarea
.
.
polythene
Material Design component library for Mithril and React
material design
toolkit
.
.
react-yearly-calendar
React.js Yearly Calendar Component
calendar
.
.
tooltip
React Tooltip
.
.
react-fa
Font Awesome icons as React components
icon
.
.
react-skylight
A react component for modals and dialogs
.
.
input-moment
React datetime picker powered by momentjs
.
.
react-bash
A configurable/extendable bash terminal React component
.
.
Essence
Essence - The Essential Material Design Framework
toolkit
material design
abandoned
.
.
react-progress-button
:cyclone: Simple react.js component for an inline progress indicator
button
.
.
react-formal
Sophisticated HTML form management for React
set
form
.
.
react-rangeslider
A lightweight responsive react range slider component.A fast & lightweight react component as a drop in replacement for HTML5 input range slider element.
slider
.
.
react-html5video
A customizeable HTML5 Video React component with i18n and a11y.
.
.
react-highlight
React component for syntax highlighting
text
.
.
react-medium-editor
React wrapper for medium-editor
text editor
.
.
cake-chart
Interactive multi-layer pie chart
dataviz
.
.
react-google-charts
A thin, typed, React wrapper over Google Charts Visualization and Charts API.
dataviz
.
.
react-calendar-heatmap
an svg calendar heatmap component, inspired by github's contribution graph
calendar
.
.
react-bootstrap-daterangepicker
A date/time picker for react (using bootstrap). This is a react wrapper around the bootstrap-daterangepicker project.
calendar
.
.
react-blocks
A higher-level react component to manage complex layouts using flexbox.
grid
.
.
react-breadcrumbs
Automatic breadcrumbs for React-Router
.
.
react-blur
React component for blurred backgrounds.
.
.
react-motion-menu
[DEPRECATED] 🍔 A spring animation menu component for React.
menu
.
.
react-sortable-pane
:sparkles: A sortable and resizable pane component for React.
.
.
react-track
Track the position of DOM elements. Create cool animations.
.
.
react-dropdown
🔽 A dead simple dropdown component for React
dropdown
.
.
react-svg-pan-zoom
:eyes: A React component that adds pan and zoom features to SVG
.
.
react-webcam
Webcam component
.
.
reactjs-popup
React Popup Component - Modals,Tooltips and Menus — All in one
.
.
react-portal-tooltip
Awesome React tooltip
.
.
react-mt-svg-lines
A React.js wrapper component to animate the line stroke in SVGs
.
.
riek
An set of common form components for React, editable in-line
set
form
.
.
react-multistep
React multistep form component
form
.
.
menu
React Menu
menu
.
.
react-gmaps
A Google Maps component for React.js
map
.
.
react-avatar
Universal avatar makes it possible to fetch/generate an avatar based on the information you have about that user.
.
.
react-avatar-cropper
Aiming to be a complete solution for avatar cropping in react.
.
.
react-search-input
:mag: Simple react.js component for a search input, providing a filter function.
search
.
.
react-cardstack
.
.
react-json-inspector
React JSON inspector component
devtool
.
.
react-sidenav
React based Sidebar Navigation component with React Router integration
layout
.
.
react-rating
A rating react component with custom symbols.
.
.
react-sanfona
Accessible react accordion component
.
.
rgx
React grid system based on minimum and maximum widths
grid
.
.
react-coverflow
A Coverflow effect component of React version made for the web.
.
.
react-infinite-grid
A React component which renders a grid of elements.
grid
.
.
react-chatview
Infinite scroll chat or feed component for React.js
chat
.
.
react-transitive-number
React component to apply transition effect to numeric strings, a la old Groupon timers
animation
.
.
react-markdown-editor
A markdown editor using React/Reflux
text editor
.
.
react-icheck
:radio_button: iCheck components built with React. Highly customizable checkbox, radio buttons and radio group.
.
.
react-serial-forms
A high performance form library built specifically for React.
form
.
.
react-snowstorm
A Snow Effect component for React.
.
.
react-svg-buttons
React configurable animated svg buttons
button
.
.
react-fittext
React Plugin to fit text on the screen
text
.
.
react-input-color
React input color component with hsv color picker
color
picker
.
.
react-user-tour
give your user a guided tour around your application
.
.
react-elemental
Modern, flat React UI component library
toolkit
.
.
elm-react-component
(deprecated) A React component which wraps an Elm module to be used in a React application.
.
.
react-auto-form
Simplifies getting user input from basic forms via onChange and onSubmit events
form
.
.
chat-template
Chat-Template is a React component that enables quick prototyping of bot conversations.
chat
.
.
react-draggable-tab
Atom like draggable tab react component
.
.
react-json-viewer
React JSON Viewer Component. View JSON in beautiful tabular format.
icon
.
.
dayz
A calendar component for React
calendar
.
.
react-prosemirror
An unofficial React component for ProseMirror
text editor
.
.
react-textgradient
Text gradients with CSS with SVG fallback.
text
.
.
react-formly
JSON powered forms for react
form
.
.
react-emoji-react
a clone of slack emoji reactions in react
.
.
react-ios-switch
React switch component https://clari.github.io/react-ios-switch
button
.
.
react-token-autocomplete
autocomplete
.
.
react-zeroclipboard
react component that abstracts zeroclipboard
wrapper
.
.
libreact
React standard library
toolkit
.
.
react-number-easing
React component for fancy number transitions.
animation
.
.
react-geomicons
React icon component for Geomicons Open
icon
.
.
react-switch-button
React Switch Button control
button
.
.
react-rotation
React rotation component
.
.
react-progress-label
progress label component
.
.
react-select-popover
A react component to convert a select box into a nifty popover with prepopulated options
autocomplete
.
.
react-evil-icons
Evil icons as react components
icon
.
.
react-json-table
A simple but reactive table react component to display JSON data.
list
.
.
react-pathjs-chart
Charts (Pie,SmoothLine,Bar,Tree,Radar,ScatterPlot) using path-js
dataviz
.
.
react-simple-pie-chart
Simple pie chart React component
dataviz
.
.
election-insights
Sentiment analysis and visualization on all things election
.
.
redux-game-of-life
An educational implementation of Conway's Game of Life using React and Redux
game
.
.
fifteen
Simple fifteen puzzle game build with react-native
game
.
.
react-notify
Tiny React's module that shows notifications.
notification
.
.
react-password-strength-meter
React Component to display password strength meter - Demo at :
.
.
react-fitter-happier-text
React component for fully fluid headings
text
.
.
react-matchmedia-connect
Higher order components for matchMedia
.
.
react-steps
Steps component for react
.
.
react-rpg
:camera: Responsive photo grid component for react js
.
.
react-balloon
[DEPRECATED] React resizable and movable balloon conponent.
.
.
react-async-button
React button component for handling async actions
button
.
.
react-timer-hoc
A React timer higher-order component
.
.
react-font-picker
React font picker component with material design inspired default styling
picker
.
.
space-invaders
Space Invaders clone in React and d3.js
game
.
.
react-initicon
Initial Icons for React
icon
.
.
lead-form
Lead capture widget
.
.
react-redux-cats
React and Redux with cats
.
.
react-thermometer
a simple thermometer gauge component (does not tell temperature)
.
.
draft-js-gutter
A reusable React.js component that compliments Draft.js with a line number gutter.
text editor
.
.
sc-react
🥇 [sc-react v1 alpha] A react library for creating non-rectangular/slanted container divs.
.
.
AKA
React components are also known as: React Component Libraries and React UI Frameworks.
CONTRIBUTING
To add to this list, submit a pull request in the javascriptstuff-db repository. Add an entry to this file.