👓 A curated list of CSS Flexible Box Layout Module or only Flexbox.
Switch branches/tags
Nothing to show
Clone or download
Latest commit b13029d Oct 24, 2017
Permalink
Failed to load latest commit information.
.gitignore The draft May 9, 2015
.travis.yml Fix .travis.yml Jul 31, 2017
README.md Update README.md Oct 24, 2017
awesome-flexbox.jpg cover image width updated Nov 29, 2015
contributing.md zeef reference added Oct 11, 2015
license.md Fix website link Jul 31, 2017

README.md

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.

Newsletter

Books

Guides

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

Cross Browser

Tips and tricks for your projects work anywhere :D

Articles

Support

Preprocessors in action

Polyfills

Other Interesting Articles

A list of issues related to flexbox.

Presentations

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

Videos

Sketching with CSS Flexbox Guide by @sfioritto

Read Materials

Video Materials

Slides and Notes

Tools

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.

Courses

Who to Follow

People who talk about it.

Contributing

Want to contribute? Follow these recommendations.

License

MIT License © Afonso Pacifer