FlatifyCSS is the web modern and minimalist flat design library inspired by the Duolingo design system. It respects accessibility and comes with the web's most common components.
When we talk about flat design, you might think about the creepy palette and some old-fashioned web trends, but no, flat design is a wide term and in this case for FlatifyCSS, there are some principles that shape it clearly you will understand it easily.
The most used patterns, highly composable and customizable.
Immutable and reusable classes to speed the development process up.
Custom and native elements to create modern forms.
FlatifyCSS is available for users in many ways, you can install it using package managers, directly from CDN, or even downloading lastest project archive.
Here is jsDelivr, you can add FlatifyCSS just with a single line of code:
<!-- CSS -->
<script src="https://unpkg.com/@popperjs/[email protected]" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/flatifycss/dist/js/flatify.min.js" crossorigin="anonymous"></script>
You can include FlatifyCSS in your project with npm, yarn or composer:
npm install flatifycss
yarn add flatifycss
composer require amir2mi/flatifycss
After installing FlatifyCSS with package managers or downloading the archive file there is a folder called
/dist, where compiled CSS, JS and their map files are there, inside this folder these files are provided:
CSS files come with some options, files with
-noprefix suffix, do not have PostCSS Autoprefixer, while
-min means this file is minified and
-rtl is the special file for languages like Arabic, Persian, Hebrew, etc which direction is right to left.