Wordpress

Customize Scrollbar In Any Website Using CSS

In this article I am going to tell you How to Add Scroll bar in your website Using CSS. If you have a Generate Press you can easily add scroll bar in your website.

Scroll bar in wordpress website
Edit scroll bar

CSS Code

Copy the below code and paste it into your Additional CSS Box if you are using Generate Press. You can change the color if you want, just play with the numbers.

Scroll bar CSS

*::-web-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.1);
	background-color: #F5F5F5;
	border-radius: 10px;margin-left:-10px!important;
}

*::-web-scrollbar
{
	width: 10px;
	margin-left:-10px;
	background-color: #F5F5F5!important;
}

*::-web-scrollbar-thumb
{
	border-radius: 10px;
	background-color: #FFF;
	background-image: linear-gradient(to right, #4CB8C4 0%, #3CD3AD 51%, #4CB8C4 100%);
}

Final Thoughts

You can also change Width, Color and Background of Scroll Bar.

Maharij Saleem

Hi, I'm Maharij Saleem, founder of Stepshowto.net. A blog that provides authentic information regarding blogging, SEO, Islam, Wordpress, and how to Earn Money Online with blogging.

Leave a Reply

Your email address will not be published. Required fields are marked *