Flexbox Playground

Set direction, wrap, justify and align on a live row or column and copy the resulting flex CSS.

Design & colourCssFlexboxLayout
Flexbox Playground screenshot
Container
Live preview — click an item to size it Item 1 selected
Item 1 — flex
Emitted CSS

      

More tools