https://github.com/amir2mi/react-flatifycss
A collection of React flat design components, based on FlatifyCSS.
https://github.com/amir2mi/react-flatifycss
components components-library components-react css flat minimal react react-components reactjs
Last synced: 12 months ago
JSON representation
A collection of React flat design components, based on FlatifyCSS.
- Host: GitHub
- URL: https://github.com/amir2mi/react-flatifycss
- Owner: amir2mi
- License: mit
- Created: 2021-12-26T21:24:24.000Z (over 4 years ago)
- Default Branch: master
- Last Pushed: 2024-12-10T21:21:42.000Z (over 1 year ago)
- Last Synced: 2025-04-13T14:56:21.251Z (12 months ago)
- Topics: components, components-library, components-react, css, flat, minimal, react, react-components, reactjs
- Language: TypeScript
- Homepage: https://react.flatifycss.com
- Size: 11.5 MB
- Stars: 10
- Watchers: 1
- Forks: 1
- Open Issues: 5
-
Metadata Files:
- Readme: README.md
- Funding: .github/FUNDING.yml
- License: LICENSE
Awesome Lists containing this project
README
React FlatifyCSS
A collection of React flat design components, based on FlatifyCSS.
Getting started
•
Homepage
•
Issues
•
FlatifyCSS
[](https://www.npmjs.com/package/react-flatifycss)
# Getting started
Start using React FlatifyCSS after installing packages and importing the style file, here is how.
## Installing packages
To install and use the library you should install both the `flatifycss` and `react-flatifycss` packages. We use the base `flatifycss` package to import styles.
Use npm or Yarn to install the packages:
### npm
```bash
npm i flatifycss react-flatifycss
```
### Yarn
```bash
yarn add flatifycss react-flatifycss
```
## Import styles
React FlatifyCSS itself does not include the FlatifyCSS styles, so you can import your preferred stylesheet in your application.
### Left to right
```js
import 'flatifycss/dist/css/flatify-min.css';
```
### Right to Left
```js
import 'flatifycss/dist/css/flatify-rtl-min.css';
```
## Use components!
Now, just import the component you need from `react-flatifycss`, for example a simple button:
```js
import React from 'react';
import { Button } from 'react-flatifycss';
export default function App() {
return Success!;
}
```