Skip to content
👓 A curated list of CSS Flexible Box Layout Module or only Flexbox.
Branch: master
Clone or download

Latest commit

Latest commit b13029d Oct 24, 2017


Type Name Latest commit message Commit time
Failed to load latest commit information.
.gitignore The draft May 9, 2015
.travis.yml Fix .travis.yml Jul 31, 2017 Update Oct 24, 2017
awesome-flexbox.jpg cover image width updated Nov 29, 2015 zeef reference added Oct 11, 2015 Fix website link Jul 31, 2017

awesome flexbox

Build Status Awesome

A curated list of CSS Flexible Box Layout Module or only Flexbox. Inspired by awesome-webcomponents and awesome-svg.

Table of Contents

W3C Specification

The specification describes a CSS box model optimized for user interface design.




Guides for developers or designer start their studies this wonderful technology.

Cross Browser

Tips and tricks for your projects work anywhere :D



Preprocessors in action


Other Interesting Articles

A list of issues related to flexbox.


Tired of reading? See an interactive presentation and learn flexbox now.


Sketching with CSS Flexbox Guide by @sfioritto

Read Materials

Video Materials

Slides and Notes


Have a little help to create their projects :D

Libraries and Frameworks

A list of incredible libraries based on flexbox.

Featured Projects

Awesome projects about flexbox.

  • Cool examples of flexbox layout - A codepen a collection.
  • flex-box - A Custom Element to make the basics of flexbox easier to use.
  • Flexbugs - A community-curated list of flexbox issues and cross-browser workarounds for them.
  • Flexbox Froggy - A game for learning CSS flexbox.
  • Flexbox Patterns - Examples and source code that will teach you how to build UI components with CSS flexbox! What’s flexbox?
  • Flexbox Defense - Tower Defense with a twist: all towers must be positioned with CSS Flexbox.
  • Flexbox tester - Understand how to calculate the width of flex items.
  • Flexbox layout - FlexboxLayout is a library project which brings the similar capabilities of CSS Flexible Box Layout Module to Android.
  • FlexLayout for iOS - FlexLayout brings flexbox to iOS using Swift. Concise, intuitive & chainable syntax.
  • grid-styled - Flexbox based responsive ReactJS grid system built with styled-components
  • iron-flex-layout - Style mixins for cross-platform flex-box layouts
  • Post Apocalypse Flexbox
  • React-flexbox - Implementation of css flexbox in react with inline styles.
  • Reflexbox - Responsive React flexbox grid system higher order component.
  • Solved by flexbox - A showcase of problems once hard or impossible to solve with CSS alone, now made trivially easy with Flexbox.🤘
  • Visualizing Flexbox - A neat little CodePen Demo to play around with Flex properties.
  • ZEEF CSS Flexbox - The awesome flexbox on zeef.🤘
  • Flexbox Zombies - A game for learning CSS flexbox.


Who to Follow

People who talk about it.


Want to contribute? Follow these recommendations.


MIT License © Afonso Pacifer

You can’t perform that action at this time.