The Most Popular React.js Responsive Components

1. React Break

A utility React component based on BreakJS. Create declarative breakpoint components for your React apps. Render different components for different layouts.

React Break

Demo

View On GitHub

2.React super responsive table

React Super Responsive Table converts your table data to a user-friendly list in mobile view.

React super responsive table

Live demo: https://react-super-responsive-table.netlify.com

View On GitHub

3.React Multistep

Responsive React multistep form component.

React Multistep

Demo: http://srdjan.github.io/react-multistep/

View On GitHub

4.Responsively

Responsively is created with the intention to easily adjust components with a responsive, mobile-first approach in mind; it may resemble single purpose classes (e.g. .mt-0, or .mt-0–mobile).

Responsively

This library plays nicely with libraries such woman_singer Emotion and nail_care Styled Components since the code output is string.

Demo: https://www.npmjs.com/package/responsively

View On GitHub

5.React Super Responsive table

React Super Responsive Table converts your table data to a user-friendly list in mobile view.

Demo https://react-super-responsive-table.netlify.com/

View On GitHub

6.React Responsive

Media queries in react for responsive design

The best supported, easiest to use react media query module.

This module is pretty straightforward: You specify a set of requirements, and the children will be rendered if they are met. Also handles changes so if you resize or flip or whatever it all just works.

React Responsive

View On GitHub

7.React image responsive

An image that is responsive to its width on the screen (can be also a background image) Works with retina displays.

React image responsive

Demo: https://youpinadi.github.io/react-image-responsive/

View On GitHub

8.React Responsive Accordion Component

React component to wrap content in Accordion element.

React accordion component which is 100% responsive.

React Responsive Accordion Component

View On GitHub

9.Reflexbox

Responsive React Flexbox Grid System

Reflexbox

Features

Simple API for quickly controlling layout
Helps promote composability and separation of concerns
CSS-in-JS built in - no external dependencies
Only generates the CSS needed to render

Moved to https://rebassjs.org

View On GitHub

10.React Responsive Tables

Better responsive tables for react! For smaller screens, this library converts a standard html table into a two column table, with the header as the first column and the corresponding data in the second column.

React Responsive Tables

View On GitHub

11.React Image Crop

A responsive image cropping tool for React.

React Image Crop

Features

Responsive (you can use pixels or percentages).
Touch enabled.
Free-form or fixed aspect crops.
Keyboard support for nudging selection.
No dependencies/small footprint (5KB gzip).
Min/max crop size.
If React Image Crop doesn’t cover your requirements then I advise to take a look at Doka.js. It features cropping, rotating, filtering, annotation, and lots more.

Sandbox Demo

View On GitHub

12.React intense

This component is a port of Intense Image Viewer for use with React.
React intense

Live Demo
http://bryce.io/react-intense/

View On GitHub

13.React Image Lightbox

A flexible lightbox component for displaying images in a React project.

React lightbox component.

React Image Lightbox

Features

Keyboard shortcuts (with rate limiting)
Image Zoom
Flexible rendering using src values assigned on the fly
Image preloading for smoother viewing
Mobile friendly, with pinch to zoom and swipe (Thanks, @webcarrot!)
No external CSS

Live Demo
https://fritz-c.github.io/react-image-lightbox/

View On GitHub

14. React Responsive Photo Gallery

Responsive, accessible, composable, and customizable image gallery component
Maintains the original aspect ratio of your photos
Creates a masonry or justified grid
Supports row or column direction layout
Provides an image renderer for custom implementation of things like image selection, favorites, captions, etc.
SSR app compatible

React Responsive Photo Gallery