Dev tools · alternatives · 2026

24 alternatives to FLEX: Visual cheatsheet for flexbox

Click to copy CSS for Flex

Below are 24 products that do a similar job, ranked by how close each is in meaning and then by launch-day votes. FLEX: Visual cheatsheet for flexbox launched in 2019; newer entries below may have overtaken it.

1SW
Struggle with CSS Flexbox? This Playground Is for You▲315
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.
2025 · yoavsbg.github.io · its alternatives →
2
Flex▲325
Flexbox's are a pain to write, Flex makes it easy.
2019 · its alternatives →
3
FlexboxPatterns▲374
Build awesome user interfaces with CSS flexbox
2016 · flexboxpatterns.com · its alternatives →
4
CSS Scan 2.0▲758
The fastest and easiest way to inspect or copy CSS ⚡️
2019 · getcssscan.com · its alternatives →
5
Flexbox Cheatsheet for Web Developers▲3
Flexbox Cheatsheet – Tips and Tricks for Web Developers
2020 · blog.duomly.com · its alternatives →
6
Flexbox.io – a free video series on learning CSS Flexbox▲236
A simple 20 video course that will help you master CSS Flexbox
2015 · flexbox.io · its alternatives →
7
CSS Scan 3.0▲256
The fastest and easiest way to check, copy and edit CSS
2022 · getcssscan.com · its alternatives →
8
Flexbox-Guide▲10
Flexbox-Guide : A flexbox code generator
2021 · flexbox-guide.vercel.app · its alternatives →
9
Webflow Flexbox UI Builder▲444
Build flexible, responsive layouts - without writing code
2016 · flexbox.webflow.com · its alternatives →
10CC
CSSFX – Click-to-copy CSS effects▲595
2019 · cssfx.dev · its alternatives →
11
CheatSheet▲982
View Mac keyboard shortcuts in the current application
2015 · mediaatelier.com · its alternatives →
12
I made CSS Scan 3.0, a fast way to check and copy CSS▲146
Goodbye to "Inspect Element" — Visualize the CSS of any element you hover over, instantly, and copy its entire rules with a single click.
2022 · getcssscan.com · its alternatives →
13
Flex Layout Attribute▲109
Layout helper based on CSS flexbox specification.
2016 · progressivered.com · its alternatives →
14IF
Interactive Flexbox Tutorial▲13
2015 · flex-tutorial.herokuapp.com · its alternatives →
15
CopyPalette▲169
Copy-paste your color palette in a blink 🤙
2019 · copypalette.netlify.com · its alternatives →
16
Flexbox Froggy▲97
A game for learning CSS flexbox
2015 · flexboxfroggy.com · its alternatives →
17
Flexbox Grid▲106
Grid based on CSS3 flexbox
2016 · flexboxgrid.com · its alternatives →
18
Flexbox Defense – learn CSS flexbox by playing a tower defense game▲243
Your job is to stop the incoming enemies from getting past your defenses. Unlike other tower defense games, you must position your towers using CSS!
2016 · flexboxdefense.com · its alternatives →
19
Complete Guide to CSS Flex and Grid▲113
Become a Pro at building components with CSS Flexbox & Grid
2022 · shrutibalasa.gumroad.com · its alternatives →
20
Beautiful CSS Checkboxes by CSS Scan▲109
Curated collection of 65 free beautiful checkboxes
2022 · getcssscan.com · its alternatives →
21
VSCode Cheatsheet▲99
A cheatsheet to help you remember keybinds for VSCode
2020 · chromewebstore.google.com · its alternatives →
22
Flex UI library for Figma▲196
700+ free Figma sections built for Tailwind CSS
2022 · figma.com · its alternatives →
23
Copy Paste CSS▲136
Find inspiration with a curated list of simple buttons
2021 · copy-paste-css.com · its alternatives →
24FE
Flexible Editor – An Open Source Flex-Box Based Layout Editor▲40
2016 · briandiehr.com · its alternatives →

Also compare

Ranked by how close each launch is in meaning, then by votes. Prices were read from each product’s own site when checked and can change. Refine with your own description →