Ecosyste.ms: Awesome

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

https://github.com/DesignRevision/shards-react

⚛️A beautiful and modern React design system.
https://github.com/DesignRevision/shards-react

bootstrap components design-system react ui uikit

Last synced: 3 months ago
JSON representation

⚛️A beautiful and modern React design system.

Lists

README 

        









Shards React is a free, beautiful and modern React UI kit 
 based on Shards.










  

    

  

  

    

  










  Documentation & Demo •

  Official Page




### Getting Started



Getting started with Shards React is fairly simple. You can download Shards React via the official website, here on GitHub as a release package or by using a package manager such as Yarn or NPM.



* [Official Website](https://designrevision.com/downloads/shards-react)

* [Release Package](https://github.com/DesignRevision/shards-react/releases)







### Quick Start



You can install Shards React via Yarn or NPM.



```bash

# Yarn

yarn add shards-react



# NPM

npm i shards-react

```







### Module Bundlers



If you are using a module bundler such as [Webpack](https://webpack.js.org/) or [Rollup](https://rollupjs.org/), you can import components as follows:



```javascript

import { Alert } from "shards-react";



import "bootstrap/dist/css/bootstrap.min.css";

import "shards-ui/dist/css/shards.min.css"



// ...

```







### Built Using



* [Shards UI Kit](https://designrevision.com/downloads/shards/)

* [React Datepicker](https://reactdatepicker.com/)

* [React Popper](https://github.com/FezVrasta/react-popper)

* [noUiSlider by Léon Gersen (WTFPL License)](https://refreshless.com/nouislider/download/)







### Contributing



Please read [CONTRIBUTING.md](CONTRIBUTING.md) for details on our code of conduct, and the process for submitting pull requests to us.







### Roadmap



[View the roadmap.](http://designrevision.com/docs/shards-react/roadmap)







### Changelog



[View notable changes.](CHANGELOG.md)