Tl;Dr:
In about:config, I changed these preferences:
- widget.non-native-theme.gtk.scrollbar.round-thumb: false - This makes the scrollbar not have rounded edges
- widget.non-native-theme.gtk.scrollbar.thumb-size: 1 - This makes the scrollbar ‘chonkier’ within the scrollbar region
- widget.non-native-theme.scrollbar.size.override: 20 - This increases the scrollbar region size. Larger number = wider scrollbar
- Make sure widget.gtk.overlay-scrollbars.enabled is set to false - This should have been set to false when you enabled “Always show scrollbars”
On Windows, Firefox follows the system setting (System Settings > Accessibility > Visual Effects > Always show scrollbars).
The 2 pixel wide scroll bar has been a pet peeve of mine for a while on my 1440p display.
Thank you stranger!
Interesting. I use a 32" 1440p screen (100% scaling) and I prefer the smaller one. I always found scroll bars to be unnecessarily large (especially in drop downs) as I solely use then as a visual indicator.
I’m glad we have options so everyone can have their preferred size!
windows 11 scrollbars being so tiny BY DEFAULT is incredibly frustrating
There’s a good reason they are done that way, namely that few people ever need to directly interact with them. People instead scroll content with their mouse wheel, touchpad or via touch devices directly, and hence the scroll bar is relegated to a pure indicator of roughly where on the page you are, which for many pages isn’t even necessary.
That being said: If you set Windows 11 to “Always show scroll bars” - which you would if you need them as actual input surfaces - then it also signals all apps to show them at full size again. Which Firefox in fact does, as I just found out.
With mouse wheels and touch screens everywhere, I can’t even remember the last time I wanted to drag a scroll bar. Even worse, I have faint memories of infinitely scrolling websites that just hated it when you dragged the scroll bar. What do you need that interaction for? I’m not judging, I’m just curious about the use case.
I seldom care to manually interact with it, but by god do I hate when it’s so narrow, low-contrast, and auto-hiding as to be virtually invisible (and I’m not even visually impaired!).
I want to know where I am, and how long the document is. Why are modern GUIs trying so hard to hide this information from me while pretending they aren’t, like a child stubbornly avoiding eye contact when the teacher asks a question?
Not OP but here’s one use case. I use FF as a PDF reader, it’s faster than Nitro and Adobe opening files and searching within. When I have a 600+ page Admin Guide open scrolling is prohibitive. When I do a text search FF puts location indicators in the scroll bar. A larger scrollbar is better visually and easier to interact with.
Also, what kind of psycho uses a touch screen on a desktop computer?
I use my pc with a “touchscreen” via VNC about 75% of the time.
Tiny scroll bars can suck it.
In that case you set the system to show them bigger, which should affect all apps.
In fact I just tested this, and if I set Windows 11 to “always show scroll bars” (which matches your use case), Firefox immediately goes to full-size scrollbar mode.
I use the scroll bar at home mostly because the scroll wheel on my mouse is finicky. If I don’t scroll just right it’ll scroll down a little before scrolling right back up or just not scroll down at all. So it’s more convenient for me to just use the scroll bar.
I use a Wacom tablet in place of a mouse (for work, and because I get serious arm pain after about ~30mn of using a mouse) and while it has a “touch ring”, it requires me to let go of the stylus and it’s not very sensitive at all, making for a poor replacement of a mouse wheel. Some time ago I got myself a macropad with big rotary knobs and they do the job, but for years I relied on scrollbars.
Genuine question. Who still uses a scrollbar for more than a visual indicator of progress?
Not usually but I also hate to be looking for the scroll position for 30 seconds when I want to see the length of the page. Depending on the colors of the page I have troubles finding.
In Firefox, never. In some applications, they have the “lines per tick” for your scroll wheel WAY too low, like 1 per. In those applications I try to, but they inevitably have visual-only scroll bars.
Pretty much never for me except when I remote in to MacOS machines for some reason Shift + Mouse Wheel doesn’t scroll horizontally. So I have to tap a left or right arrow key and then drag the bar.
Thanks! Do you know if there’s a way to set it to use fixed high-contrast colors? Mine changes based on web page content and is almost always lower contrast than I’d like.
Firefox kinda sucks OOTB, these tweaks along with text render and smooth scrolling ones should be the default.
Could you elaborate on the text render and smooth scroll tweaks? I’m always interested in toying around with this kind of stuff :D
I don’t remember all the settings I changed, it was years ago, but when I initially swapped from Chrome I found the text on Firefox was horrible. Here’s what I found though for text:
gfx.font_rendering.cleartype_params.enhanced_contrast = 100
gfx.font_rendering.cleartype_params.pixel_structure = 5
gfx.font_rendering.cleartype_params.rendering_mode = 5
gfx.font_rendering.fallback.always_use_cmaps = true
And for smooth scrolling:
general.smoothScroll.currentVelocityWeighting = 0
general.smoothScroll.lines.durationMaxMS = 250
general.smoothScroll.msdPhysics.enabled = true
general.smoothScroll.stopDecelerationWeighting = 0.82
mousewheel.min_line_scroll_amount = 23
These tweaks made it much nicer for me personally, of course text rendering may differ on OS (I use W10).
Thanks a ton!