Slider dot colours

Design help General
1

Hi everyone,

I’m trying to change the slider dot colours using a html embed element, I found a post in the forum (Any way to style slider navigation dots using code or a creative workaround?) and implemented what it said, but it didn’t work. I put the code in the embed, and also in the footer, but again, didn’t work unfortunately!

I want to change the slider dot colours to: #02F2B2 and I want one of the dots to appear bigger than the rest to indicate what slide the user is on.

Would appreciate the help!

-Fatimah

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

1 Like
2

Hello @Fatimah_N

I will share a video where you will see how to create absolutely custom dots. Give it a try and reach out if you want some help.

Piter :webflow_heart:

3

Pretty in-depth, thanks. If i just wanted to change the colour of the dots of the current slider though, instead of creating a brand new, custom one, is there a way of doing that by using a code embed?

4

If you pop an HTML embed on your page and include the following code:

<style>
   .w-slider-dot {background: #CAE5D7;}
   .w-slider-dot.w-active {background: #84C6A5;}
</style>

You can change the default dot colours for Webflow sliders really quickly.

My question: Can you change the colours of more than one default Webflow slider on a page, or do you have to build a custom one?

Thanks.