Flexbox Cheatsheet
Generate a small Flexbox reference for alignment, wrapping and gaps.
How to use this tool
- Enter values or select a file in the labelled controls.
- Select the action button and review the result.
- Copy the result or use its download control when available.
Use the separate Flexbox Playground for an interactive layout. The main and cross axes depend on flex-direction.
Processing takes place in this browser. Your entries are not sent to a conversion service.