Webflow Slider: Custom Dot Color Change Using CSS

You'll need a premium plan for this to add in your custom code area.

Recently Webflow has launched an amazing feature on backgroud videos where your website visitors can stop and play background videos easity.

Watch a video to learn how you can integrate in your Webflow website too.

Follow these steps to add slider dot CSS to your Webflow website:

Step 1) Add a Webflow Slider

Step 2) Go to custom code area from your project settings

Copy and paste below code to your </head> area of your custom code section.

.w-slider-dot {
background: black;
.w-slider-dot.w-active {
background: red;

Step 3) Publish your changes

Once you're done adding above mentioned steps then now it's time push your changes to the live site.

Click here to see the live preview.

That's all for now.

We at TweakDesigns help businesses like yours with website building and SEO implementation. If you find any difficulty installing plugins or want to know more then you can mail us at ashok@tweakdesigns.in or you can subscribe to our newsletter where we share lots of cool stuff for better website design and development.

let's get started

Let’s talk about your dream project?

Need help to start a custom project or integrate a third party app into your Webflow project? Our team is ready to work to find the best solution that fits your needs.

Schedule your meeting now!
Ashokkumar Chavada
CEO and Webflow Expert