How to Hide Scrollbar in Google Chrome: With and without Extension

If you have a tiny computer screen, then you might always be wondering how you could get the maximum space on it. A scroll bar in Google Chrome already occupies a significant amount of space while browsing in Google Chrome. I am sure you might have thought of how you can get rid of it. Today, we are going to see how to hide the scrollbar in Google Chrome while not in use.

Most of the laptops come with a smaller screen, and even if you have a larger working screen, why would you need a scroll bar? Isn’t it?

I am sure the answer is yes, we all need a wider screen while working.

This is what we want to get rid of

Typically, the browsers are designed in such a way that a user could scroll through the mouse cursor from the right pane.

And that was done considering the earlier days’ computer mice, which used to have only two buttons. No middle mouse or scroll wheel at all.

Though people are habituated to scrolling through that slider. So changes haven’t been placed into browsers as well.

But now every computer mouse has a middle mouse key(scroll key). And most people use it while browsing.

In this case, we can avoid that thicker Google Chrome overlay scrollbar.

Recently, I was on Quora, and found a query there, How would I remove or hide the scroll bars from Google Chrome?

As we can see in the image below –

I have seen a few replies to that, and those were – “Press F11 to view the Full screen” and the other one “install a third-party extension”.

• But, what if someone wants to see the Browser top menu and Address bar as well? Makes sense, doesn’t it?
• Why do we need to add one more extension, as we already have an inbuilt feature in Google Chrome?

Chrome developers are aware of such things, and they have already had the solution in overlay scrollbars. But, they haven’t made it by default.

But, fortunately, we can activate it from the Google Chrome Experimental Features.

How to Hide the Scrollbar in Google Chrome

Step 1. Open a Google Chrome tab

Step 2. Paste the below URL in the Google Chrome address bar

chrome://flags/#overlay-scrollbars 

It will take you to the Chrome experimental features. Click in the drop-down.

Step 3. By default, it will be disabled (set as default), you need to enable it to hide the Scrollbar.

Step 4. Click on the Relaunch Now Button that shows at the bottom of the Chrome browser.

Alternatively, you can also use this method to restart Google Chrome to see the changes.

This will hide the scrollbar completely. When you scroll the page through the mouse wheel, you will see a thinner scroll bar with some amount of transparency.

Isn’t it cool?

And the best part is that when you hover the mouse around the sidebar, you will be able to see the scrollbar completely.

Say a BIG NO to that horizontal Scrollbar in Chrome. And if you are interested in the Chrome extension method. Let me show you that, too.

Hide Scrollbar using Chrome Extension and CSS

Yeah, if you are not sure and hesitant about the above method. Then you can also use a Chrome extension to hide the scrollbar.

Step 1. Install the Rescroller Chrome extension.

Step 2. In the General section, by default, the scrollbar size would be 8px; you can change it to 1px to reduce the scrollbar width.

If you want to completely remove the scrollbar, then follow step 3.

Step 3. Scroll to the bottom Miscellaneous section

Step 4. Check Use Custom CSS, and add the below CSS.

display: none;

This is how you can do it: hide the scrollbar with CSS using a Chrome extension.

So, you see the scrollbar only when you want to use it; other than that, it will be completely hidden and you will get an extended page to work.

Consider sharing if this helps.