Flex box direction visualizer

This helps you with CSS Flexbox

This page runs a script that shows you the main-axis (green) and cross-axis (red) according to the flex direction declared on the flex container.

TODO: Make it a bookmarklet

flex-direction: row

Item 1
Item 2
Item 3

flex-direction: row-reverse

Item 1
Item 2
Item 3

flex-direction: column

Item 1
Item 2
Item 3

flex-direction: column-reverse

Item 1
Item 2
Item 3