I created a flexbox cheatsheet based on cheatsheets. My goal was to take what I was learning about flexbox and develop a fun, accessible, highly visual resource. The reader can quickly find a flexbox solution broken down by particular intentions in a natural decision based flow.
I struggled with flexbox at first and hadn’t come across a resource that broke it down visually so I decided to make one.
The Flexbox Cheatsheet Cheatsheet was born a bit out of frustration. I wasn’t able to find beginner friendly flexbox resources on the web that presented the basics in a logical, easy to follow manner. I set out to design and create a quick, highly visual guide to getting started with flexbox which was organized in a flow chart/decision tree manner. The post also includes a link to the demo that I created to base the cheatsheet off. Using fruit in the design establishes a friendly and inviting tone while also successfully communicating the various flexbox functionalities.
This PDF continues to be one of my most visited resources on the web today.
A fun approachable theme, assumption of basic HTML/CSS knowledge, basic demo included, appeal to beginners, PDF version available, clear custom visuals for communication, diagrams