If you already know CSS, then you are at an advantage when it comes to learning Webflow.

You see, Webflow might look like Sketch or Figma but behind a very thin veil of GUI, Webflow is CSS and HTML. For this reason, a developer can learn Webflow faster than a designer — 100% guaranteed.

Essentially WebFlow is CSS with dropdowns.

position: relative, fixed, sticky, absolute

Look familiar?

I Don’t Care about the No-Code vs Code Rivalry

Seriously, I have zero opinions.

It’s tech, people use different things for different reasons — Do what makes you happy.

Nah, Nah, Nah… I want to write about how spending a day or two learning Webflow might be the best thing you ever do for your CSS skills.

It was for me.

Webflow is a Bloody Fantastic Way to Visualise and Master the Box Model

Before Webflow, it was not uncommon for me to do something hard in JavaScript to avoid writing a few lines of CSS.

I never realized how much time I was wasting brute-forcing layouts when just a teeny tinny bit more knowledge meant auto-responsive layouts and a whole new approach to positioning.

I never knew why there were no “justify-items” and “justify-self” properties on flexbox?, and I lacked a sufficient visual mental model of what was really happening behind the screen.

How have I managed to remain ignorant? Because if I just try a few different things, I normally end up with the layout I am looking for.

Webflow pointed out how silly I was being but giving me a very high resolution peek into how my CSS was influencing visual elements.

Webflow is A CSS Playground on Crack

You have all these helpful visual guides like how you can always see the outline of any div, even if it has no background or height, or width.

And with a few clicks, you can experiment with different flex-box layouts and properties in real-time. You can see the difference between two properties, and all the available properties and flick back and forth until you really understand what’s going on.

You can mess around with auto positionings and see how they behave differently on absolutely positioned elements and have your eureka moments and build out those synaptic pathways.

Webflow Has Been Eye-Opening

You know how you need to wrap sticky elements in sticky-scroll-containers to limit their scrollable area, do you know how much easier that is to understand once you see it visually?

Webflow and the Webflow University — which is supposed to take a month but really doesn’t — taught me how to use divs as camera perspective frames to handle movement through 3D space.

And it’s all CSS, or at least the logic is.

There’s Nothing Else I Want to Say

Us visual-kinesthetic learners gotta stick together.

I am not endorsed by or affiliated with Webflow. I don’t even know if I’ll continue to use it going forward. I just really like how much it helped my CSS, and I want you to feel the same.