📦
Flexbox Playground
Interactive CSS flexbox visualizer · All properties · Copy CSS instantly
Container
flex-direction
row
row-reverse
column
column-reverse
justify-content
flex-start
flex-end
center
space-between
space-around
space-evenly
align-items
stretch
flex-start
flex-end
center
baseline
flex-wrap
nowrap
wrap
wrap-reverse
align-content
stretch
flex-start
flex-end
center
space-between
space-around
gap
px
Items
+ Add
− Remove
5 items
Item 1
flex-grow
flex-shrink
flex-basis
align-self
auto
flex-start
flex-end
center
stretch
order
Copy CSS
← All Tools
DevTools Suite
CSS Gradient
Box Shadow
Color Palette
SQL Formatter