Awesome Flexbox
:eyeglasses: A curated list of CSS Flexible Box Layout Module or only Flexbox.
This page lists names, links and short descriptions. The original list on GitHub is the source and belongs to its authors.
W3C Specification
Newsletter
CSS Layout News
. A weekly collection of tutorials, news and information on all things CSS Layout.
In 2 lists
In 2 lists
Responsive Design Weekly
. A free, once–weekly round-up of responsive design articles, tools, tips, tutorials and inspirational links.
In 4 lists
Web Design Weekly
. Just pure awesome links to the best news and articles to hit the interweb during the week.
In 2 lists
Books
Guides
A guide to flexbox
metal:
In 4 lists
Cross Browser
Sass flex mixin
Set of mixins for those who want to mess around with flexbox using the native support of current browsers.
In 2 lists
Flexibility
metal:
Other Interesting Articles
Presentations
What the flexbox?
A simple 20 video course that will help you master
Presentations >Sketching with CSS Flexbox Guide by @sfioritto
Tools
Libraries and Frameworks
In 2 lists
Flexboxgrid
metal:
In 3 lists
Flex Grid Framework
metal:
Fuux
Fuux is a Flexbox library that uses the same flexbox interface like classes.
Ginger Grid
A Flexbox grid framework named after a cute dog.
Bulma
A modern CSS framework based on Flexbox
In 2 lists
Milligram
A minimalist CSS framework
RolleiFLEX
Just a responsive flexbox grid
Waffle Grid
An easy to use flexbox grid system
In 2 lists
Featured Projects
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.
In 2 lists
Flexbox Froggy
A game for learning CSS flexbox.
In 3 lists
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.
In 4 lists
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.
In 4 lists
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
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.:metal:
Visualizing Flexbox
A neat little CodePen Demo to play around with Flex properties.
ZEEF CSS Flexbox
The awesome flexbox on zeef.:metal:
Flexbox Zombies
A game for learning CSS flexbox.
Courses
CSS Flexbox Layout
treehouse
Learn Flexbox for free
scrimba
In 2 lists
Related lists in Front-End Development
See category93
Awesome Vue
vuejs/awesome-vue
🎉 A curated list of awesome things related to Vue.js
93
Awesome DESIGN.md
VoltAgent/awesome-design-md
A collection of DESIGN.md files analysis by popular brand design systems. Drop one into your project and let coding agents generate a matching UI.
91
Awesome Angular
PatrickJS/awesome-angular
:page_facing_up: A curated list of awesome Angular resources
90
Awesome Blazor
AdrienTorris/awesome-blazor
Resources for Blazor, a .NET web framework using C#/Razor and HTML that runs in the browser with WebAssembly.
88
Must-Watch CSS
AllThingsSmitty/must-watch-css
CSS talks you have to see covering CSS Grid, flexbox, custom variables, performance, frameworks, tooling, and more! 📺
87
Awesome React Native
jondot/awesome-react-native
Awesome React Native components, news, tools, and learning material!