CSS Flexbox Generator
Flex Direction
Row
Row Reverse
Column
Column Reverse
Justify Content
Flex Start
Flex End
Center
Space Between
Space Around
Space Evenly
Align Items
Flex Start
Flex End
Center
Baseline
Stretch
Flex Wrap
No Wrap
Wrap
Wrap Reverse
Align Content
Flex Start
Flex End
Center
Space Between
Space Around
Stretch
Gap
Flex Grow
0
Flex Shrink
1
Flex Basis
Order
0
Number of Items
3
Presets
Centered
Space Between
Column Stack
Clear Custom Presets
Save Preset
Reset
Generated Code
Copy
Preview
Flex Item 1
Flex Item 2
Flex Item 3
Resize this container by dragging the bottom-right corner
Generated Code
CSS
HTML
Copied to clipboard!