# [Flat UI Free](http://designmodo.github.io/Flat-UI/)

Flat UI is a beautiful theme for [Bootstrap](http://getbootstrap.com). We have redesigned many of its components to look flat in every pixel.

To get started, check out [getting started page](http://designmodo.github.io/Flat-UI/docs/getting-started.html) or follow instructions below.


## Links:

+ [Demo Page](http://designmodo.github.io/Flat-UI/)
+ [Download PSD](http://designmodo.com/flat-free/) (for designers)
+ [Flat UI Pro 1.3.2](http://designmodo.com/flat/) (from $39)


## Quick start

Three quick start options are available:

- [Download the latest release](https://github.com/designmodo/Flat-UI/archive/2.2.2.zip).
- Clone the repo: `git clone https://github.com/designmodo/Flat-UI.git`.
- Install with [Bower](http://bower.io): `bower install flat-ui`.

Run `npm install` and `bower install` to install dependencies.

Read the [getting started page](http://designmodo.github.io/Flat-UI/docs/getting-started.html) for information on the framework contents.

Examples: <https://github.com/designmodo/Flat-UI/tree/master/docs/examples>.


### What's included

Within the download you'll find the following directories and files, logically grouping common assets and providing both compiled and minified variations. You'll see something like this:

```
flat-ui/
├── dist/
|   ├── css/
|   |   ├── vendors/
│   |   ├── flat-ui.css
│   |   └── flat-ui.min.css
|   ├── js/
|   |   ├── vendors/
│   |   ├── flat-ui.js
│   |   └── flat-ui.min.js
|   ├── fonts/
|   |   ├── lato/
|   |   └── glyphicons/
|   |        ├── flat-ui-icons-regular.eot
|   |        ├── flat-ui-icons-regular.svg
|   |        ├── flat-ui-icons-regular.ttf
|   |        ├── flat-ui-icons-regular.woff
|   |        └── selection.json
|   ├── img/
|   └── index.html
├── docs/
|   ├── examples/
|   ├── components.html
|   ├── getting-started.html
|   └── template.html
├── fonts/
|   ├── glyphicons/
|   └── lato/
├── img/
├── js/
└── less/
    ├── mixins/
    ├── modules/
    ├── flat-ui.less
    ├── mixins.less
    └── variables.less

```

We provide compiled CSS and JS (`flat-ui.*`), as well as compiled and minified CSS and JS (`flat-ui.min.*`). Fonts with icons are included.


## Documentation

Flat UI's documentation, included in this repo in the docs directory and publicly hosted on GitHub Pages at <http://designmodo.github.io/Flat-UI/docs/components.html>.


## Authors

**Sergey Shmidt**

+ <http://shmidt.in>
+ <http://twitter.com/monstercritic>

**Sergii Iurevych**

+ <http://twitter.com/iurevych>
+ <http://github.com/iurevych>

**Dmitry Pytkin**

+ <http://twitter.com/pytkin>
+ <http://github.com/pytkin>


## Copyright and license

Flat UI Free is licensed under a Creative Commons Attribution 3.0 Unported (CC BY 3.0)  (http://creativecommons.org/licenses/by/3.0/) and MIT License - http://opensource.org/licenses/mit-license.html.

You are allowed to use these elements anywhere you want, however we’ll highly appreciate if you will link to our [website](http://designmodo.com).


## Typeface
Flat UI Free is made using the Lato typeface, which can be downloaded for free here: http://www.google.com/webfonts/specimen/Lato


## Useful Links (How To)

How to Use UI Kits, Beginners Video Tips: <http://designmodo.com/how-to-use/>

UI Kit Benefits: <http://designmodo.com/benefits/>


Create a Website using UI Packs (PSD to HTML) – Day 1: <http://designmodo.com/create-website-day-1>

Create a Website using UI Packs (PSD to HTML) – Day 2: <http://designmodo.com/create-website-day-2>

Create a Website using UI Packs (PSD to HTML) – Day 3: <http://designmodo.com/create-website-day-3>

Create a Website Design using The Bricks UI: <http://designmodo.com/website-design-bricks-ui/>

What is UI Kit and Why You Should Use it: <http://designmodo.com/ui-kit-use>

How Companies can Save Time and Money Using UI Kits: <http://designmodo.com/save-time-money-using-ui-kits>

UI Kits for Developers – Prototyping and Homemade Design:	<http://designmodo.com/ui-kits-developers>


More products from Designmodo: <http://designmodo.com/shop/>

Tutorials: <http://designmodo.com/tutorials/>

Freebies: <http://designmodo.com/freebies/>

Affiliate Program (earn money): <http://designmodo.com/affiliates/>


Social Media:

Twitter: <http://www.twitter.com/designmodo>

Facebook: <http://www.facebook.com/designmodo>

RSS: <http://feeds.feedburner.com/designmodo>

Google+: <https://www.google.com/+DesignModo>
