CSS Flexbox Playground

Experiment with different flex properties to understand how they affect layout. Adjust the controls below to see changes in real-time and copy the generated CSS code.

flex-direction:

justify-content:

align-items:

flex-wrap: