Participate in the next Webflow Challenge!

How to learn CSS with Webflow?

If you want to offer quality services to your customers, I strongly advise you to learn CSS with Webflow. But how can I do it?

Updated on


learn css with webflow
Photo by Jessica Lewis on Pexels

I understand that you want to embellish your site and personalize it as much as possible! It will help you to stand out, but also, to train yourself to offer quality services to your customers! In this case, you need to learn CSS. But how do you do it? I advise you to learn CSS with Webflow.

Several ways to learn CSS

You will find a lot of information on the internet! There are specialized sites like css tricks or w3schools. The best thing about these sites is that you have access to new stuff every week. Only, these CSS learning methods are considered as "traditional". So I propose you another way to learn CSS: learning css with Webflow.

Why learn CSS with Webflow?

Quite simply, because it's quick and easy! And if you already have some basic notions in CSS, you have an undeniable asset, because you can surpass yourself even more. You'll be able to offer your clients even more personalized sites, without limits.

learn css with webflow
Photo by Jessica Lewis on Pexels

What about beginners?

It's simple! Take a ready-made template from Webflow; the one you want to be inspired by. Then you just clone it. Once you've duplicated the site, it's all yours; all you have to do is change anything you want. The edit bar is on the right-hand side.

To modify a particular element, you click directly on it. Otherwise, in the bar on the right are the HTML codes. You can also click on it, and then modify the CSS linked to this element. Tomorrow, I'll write an article about: how to learn HTML with Webflow ;)

CSS and Webflow: very practical

Specifically, what can you change? Anything visual. In fact, CSS allows you to bring HTML codes to life. The latter actually acts like a simple skeleton. Without CSS, it's not pretty at all!

However, the elements to be modified are :

  • the form
  • typography
  • the colors
  • the effects
  • opacities
  • shadows
  • etc.

There is a Youtube video in which I describe this at the bottom of the article. Support me by subscting to the YouTube channel "Happy Desk Design"

learn css with webflow
Photo by Tim Gouw on Pexels

Let's take the case of a button. You can change its shape, for example, by rounding its sides. You can even add an effect, by changing the "hover" option. I describe it more clearly in the video I posted about it. Then, the text on the button can also be changed (color, background, typography...).

Webflow: Easy to use

CSS with Webflow is very easy. As you have certainly seen in the previous paragraphs, even a beginner is able to modify the CSS of a site with Webflow.

Moreover, the interface is very intuitive. At first glance, you can see that the elements are hierarchical so that you can easily find your way around (with class and id). If you know something about CSS, and you need the code you just designed (instantly), you just have to export it. Yes, it's possible!

learn css with webflow
Photo by webandi--1460261 on Pixabay

There, I have revealed to you a secret that others don't know ;) There are some people who modify their web site without even knowing they are touching codes. And by the way, with codes themselves, you could never have achieved such great results as you'll do with Webflow (unless you're already a real code ace). You'd better learn CSS with Webflow.

YouTube: Learn CSS with Webflow

Come back to this page whenever you want. Did you come up with any ideas I might have forgotten? If so, what are they? Leave a comment below or send an email to hello@happydesk.be.
Kevin Palombo, Manager of Happydesk.

Coffee break

4 items you might like


Register here to receive the free Discovery Training

Start by taking the Discovery Training, where you will learn the basics of Webflow and a taste of what to expect in the Start Weblow training.

Start the free training