An Introduction to Frow CSS

Frow is an open source HTML and CSS framework for creating quick & responsive projects on the web, powered by Flexbox.
Frow makes working with CSS Flexbox instant.
  • Wrap groups of elements with a .frow class to instantly display:flex them.

  • Use shortcut Flexbox classes (justify-center, direction-column, etc.) for positioning.

  • Stop writing so much CSS! Use Frow to layout elements and save writing CSS for you know... actually styling things.

  • Frow dramatically reduces the amount of CSS you have to write!

Frow can do anything!

Quickly create whatever elements you need from Flexbox using Frow's shortcut classes. Anything can be made in Flexbox!

Examples:
481
Posts
5162
Likes
342
Followers

Centered Title

Vertical and horizontal centering

1

2

3

4

5

6

7

8

9

10

11

12

13

14

1

2

3

4

5

6

7

8

9

10

11

12

13

14

.col-md-1-1

.col-md-1-2

.col-md-1-2

.col-md-1-3

.col-md-1-3

.col-md-1-3

.col-md-1-4

.col-md-1-4

.col-md-1-4

.col-md-1-4

.col-md-1-5

.col-md-1-5

.col-md-1-5

.col-md-1-5

.col-md-1-5

Grid System Included

Frow's grid system brings the standard features you expect, but built with display:flex. This means no floats, and no messing with clearfix hacks!

Because the grid is built with Frow, the grid is extremely powerful! Use Frow's Shortcuts to do things such as make overflows centered or left-aligned, or aligning columns vertically.

Looks good out of the box

Frow comes with default styling of elements to provide a slick experience for users.

By getting modern browsers styled consistently, adding in your own styles on top allows you to quickly make Frow match your design. No CSS "hacks" required.

Getting Started