Style Browser scrollbar with gradients using Css

Adarshreddy Adelli
·
Style Browser scrollbar with gradients using Css

Browsers come with their default Scroll bar. There comes a situation, to style the scrollbar of the browser as our web app should attract user of every possible browser out there in the market.
style browser scrollbar gradient css

Here is a css code that applies a gradient to the scrollbar.



But this doesn't work in  Microsoft Edge and firefox, whereas in Chrome it works fine.





 Here  -WebKit-scrollbar   refers to the scrollbar -Webkit-scrollbar-track   refers to the part other than the scrollbar drag handle and -thumb   refers to the handle.

 Also read Boost your website quality and SEO using Lighthouse