Data

Tools

Indexes

Applications

Experiments

Awesome

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

https://github.com/mdbootstrap/react-comparison-table

Responsive React comparison table templates built with Bootstrap 5. Various examples like comparison table on pricing page, comparison card, product comparison & more. https://mdbootstrap.com/docs/react/extended/comparison-table
https://github.com/mdbootstrap/react-comparison-table

bootstrap bootstrap-template bootstrap-theme bootstrap5 comparison-table css html js react

Last synced: about 1 year ago
JSON representation

Responsive React comparison table templates built with Bootstrap 5. Various examples like comparison table on pricing page, comparison card, product comparison & more. https://mdbootstrap.com/docs/react/extended/comparison-table

Awesome Lists containing this project

README 

          
![MDB Logo](https://mdbootstrap.com/img/Marketing/general/logo/medium/mdb-react.png)



# MDB React 5



Responsive comparison table templates built with Bootstrap 5. Various examples like comparison table on pricing page, comparison card, product comparison & more.



Check out [React Comparison table Documentation](https://mdbootstrap.com/docs/react/extended/comparison-table) for detailed instructions & even more examples.



## Basic example

![React Comparison table Basic Example](https://user-images.githubusercontent.com/108793661/184127659-a3a1ee98-d528-4625-af7b-3696112db480.png)

```js

import React from "react";

import {

  MDBContainer,

  MDBIcon,

  MDBTable,

  MDBTableBody,

  MDBTableHead,

} from "mdb-react-ui-kit";



export default function App() {

  return (

    

      

        

          

            

            

              PRO

            

            

              Basic

            

          

        

        

          

            Domain customization 

            

              

            

            

              

            

          

          

            FTP

            

              

            

            

              

            

          

          

            Database

            

              

            

            

              

            

          

          

            Support

            

              

            

            

              

            

          

          

            Backups

            

              

            

            

              

            

          

        

      

    

  );

}



```



## How to use?



1. Download MDB 5 - free REACT UI KIT



2. Choose your favourite customized component and click on the image



3. Copy & paste the code into your MDB project



[▶️ Subscribe to YouTube channel for web development tutorials & resources](https://www.youtube.com/MDBootstrap?sub_confirmation=1)



## More examples

### Comparison on pricing:

[![React Comparison table #1](https://user-images.githubusercontent.com/108793661/184127943-1cbad596-933e-4e88-a66f-2961f612c9f3.png)](https://mdbootstrap.com/docs/react/extended/comparison-table/#comparison-pricing)



### Extended comparison table:

[![React Comparison table #2](https://user-images.githubusercontent.com/108793661/184128145-c902ce89-89dd-4fb5-8bc8-358d9486e400.png)](https://mdbootstrap.com/docs/react/extended/comparison-table/#comparison-table-extended)



You can find other examples [here](https://mdbootstrap.com/docs/react/extended/comparison-table).






## More extended React documentation