User Experience on mobile might not be great yet, but I'm working on it.

Your first time on this page? Allow me to give some explanations.

Awesome Flexbox

A curated list of CSS Flexible Box Layout Module or only Flexbox.

Here you can see meta information about this topic like the time we last updated this page, the original creator of the awesome list and a link to the original GitHub repository.

Last Update: Dec. 3, 2020, 12:09 a.m.

Thank you afonsopacifer & contributors
View Topic on GitHub:
afonsopacifer/awesome-flexbox

Search for resources by name or description.
Simply type in what you are looking for and the results will be filtered on the fly.

Further filter the resources on this page by type (repository/other resource), number of stars on GitHub and time of last commit in months.

W3C Specification

Newsletter

Books

Guides

Articles

Support

Preprocessors in action

Flexbox mixins

1.14K
248
2y 10m
MIT

sass-flex-mixin in stylus edition

11
2
6y 6m
n/a

Polyfills

A JavaScript polyfill for Flexbox

4.34K
530
2y 116d
MIT

Legacy support for the CSS3 Flexible Box Model

1.12K
123
7y 8m
n/a

A grown-up polyfill for a grown-up flexbox.

257
16
7y 5m
n/a

Other Interesting Articles

Videos

Read Materials

Video Materials

Slides and Notes

Tools

Libraries and Frameworks

Modular grid powered by Lost and BEM

137
19
3y 9m
n/a

Grid based on CSS3 flexbox

9.06K
1.15K
2y 119d
n/a

flexbox library to create amazing layouts

8
0
2y 43d
MIT

A minimal flexbox grid system named after a cute dog.

29
7
115d
MIT

A modern CSS framework based on Flexbox. Also has Sass import for modification.

A minimalist CSS framework

Just a responsive flexbox grid

An easy to use flexbox grid system

Featured Projects

A Custom Element to aid usage of flexbox

2
3
5y 11m
n/a

A community-curated list of flexbox issues and cross-browser workarounds for them.

12.6K
438
7m
MIT

Flexbox for Android

16.22K
1.7K
73d
Apache-2.0

FlexLayout adds a nice Swift interface to the highly optimized facebook/yoga flexbox implementation. Concise, intuitive & chainable syntax.

1.25K
118
72d
MIT

This package has moved and renamed

2.08K
118
1y 4m
MIT

work in progress.

30
2
4y 6m
MIT

React flexbox implementation

162
13
2y 11m
n/a

Moved to https://rebassjs.org

1.37K
73
2y 10m
n/a

A showcase of problems once hard or impossible to solve with CSS alone, now made trivially easy with Flexbox.

12.78K
1.05K
5m
MIT

A game for learning CSS flexbox.

Examples and source code that will teach you how to build UI components with CSS flexbox! What’s flexbox?

Tower Defense with a twist: all towers must be positioned with CSS Flexbox.

Understand how to calculate the width of flex items.

Style mixins for cross-platform flex-box layouts

A neat little CodePen Demo to play around with Flex properties.

Courses

Who to Follow

Web designer, speaker, writer, consultant, musician.

Designer @CodePen. Writer @Real_CSS_Tricks.

Web designer/developer specializing in CSS, RWD, UX, & accessibility.

Software Engineer at @twitter.

Engineer at Google • Open Source Advocate • Developer • Designer • Writer.

Web Developer, half of @grabaperch CMS, CSS Working Group Invited Expert.

Author of the @Codrops CSS Reference & Co-author of the Smashing Book #5.