Mimic the look of Ubuntu’s Overlay-scrollbars in Chrome/ium

By Joey Sneddon, Published May 5, 2011

Chrome/ium doesn’t use Ubuntu’s new Overlay Scrollbars which is a shame: thy’re cute, slim and awesome to use.

Whilst we can’t enable overlay scrollbars themselves in Chrome/ium we can at least match the look, courtesy of reader Micha R who mailed in just how to do this…

Mimic Ubuntu 11.04 overlay-style scrollbars in Chrome/ium

First step is to install this ‘Scrollbar minimizing’ extension in Chrome/ium.

chrome.google.com/extensions/detail/ojmmnceaidnmminjjffpndcbdibelgam

After installing we’ll change the colour to Natty orange. Hit ALT+F2 or open a terminal and enter: -

gedit ~/.config/chromium/Default/Extensions/ojmmnceaidnmminjjffpndcbdibelgam/1.0_0/css/scroll-bars.css

For Google Chrome users use: -

gedit ~/.config/google-chrome/Default/Extensions/ojmmnceaidnmminjjffpndcbdibelgam/1.0_0/css/scroll-bars.css

In the file that opens change “#666″ in lines 16 and 22 to “#F07746″ and hit save.

To see line numbers in Gedit enable ‘line numbers’ in ‘Edit > Preferences’

Restart chromium and violá – Natty-style scrollbars.

Post a comment or leave a trackback: Trackback URL.

http://twitter.com/Srphea Srphea
I’m pretty sure I’m using the last Chromium daily, yet I’m getting : “Sorry, we don’t support your browser just yet. You’ll need Google Chrome to install apps, extensions and themes.
Download Google Chrome”

Anonymous
+1

http://twitter.com/ashutoshrishi Ashutosh Rishi
+1

Waldir Leôncio
Maybe it only works on Chromium 11 (i.e., stable)?

http://twitter.com/dbrenha daniel brenha
i have 11 and i am also getting the same message

http://www.facebook.com/jordan.badangayon Jordan M. Badangayon
@twitter-47633371:disqus : i guess you have to reinstall chromium then from the software center. i just installed chromium a couple of days ago and i have already installed 3 extensions without any problems…

http://twitter.com/dbrenha daniel brenha
i have 11 and i am also getting the same message

Anonymous
+1

http://fitoschidoblog.wordpress.com Adolfo Jayme (Fitoschido)
-1.

http://www.facebook.com/cespinal17 Carlos Alberto Espinal
1+1-1+1=32

https://launchpad.net/~vlk-charles kunk
actually it is 10 in base 2 and 2 in base >2, or not?
http://twitter.com/fr33b0t Anonymous Anon
+1

http://pulse.yahoo.com/_FX5ITOLLHVNOY673XBRGCKF3DI Freddi
can’t you just paste it in the userChrome.css?
I have no clue why the extension is needed…
http://pulse.yahoo.com/_FX5ITOLLHVNOY673XBRGCKF3DI Freddi
can’t you just paste it in the userChrome.css?
I have no clue why the extension is needed…

http://twitter.com/michote_ Micha Reischuck
Great Idea, didn’t even thought of (I sended this in). Just pasting to Custom.css didn’t work for me. I had to modify the css a bit.
But pasting
[Code]
::-webkit-scrollbar {
height: 3px !important;
width: 3px !important;
background: #F07746 !important;
}
::-webkit-scrollbar-track-piece {
background-color: #F2F1F0 !important;
}
::-webkit-scrollbar-thumb {
background: #F07746 !important;
}
[/Code]
into
~/.config/chromium/Default/User StyleSheets/Custom.css
gave me the same result.
Post schould be updated, as a lot of people seems to problems, installing extensions …

tandiyo utomo
I have tried and succeeded
Good tricks
tandiyo utomo
I have tried and succeeded
Good tricks

http://profiles.google.com/okaa.pii Dylan C.
Same on Chromium 11.
http://profiles.google.com/okaa.pii Dylan C.
Same on Chromium 11.
http://profiles.google.com/commodore8487 Luisa F. Giraldo C.
I had the same issue, today, after updating…
I have installed Chromium 13.0.756.0 (84190) in Ubuntu 10.04
Waiting for the next update hoping that solves the problem.

http://www.facebook.com/cespinal17 Carlos Alberto Espinal
Hola Luisaaaaaaaaaaaaaaaaaaaaa

http://profiles.google.com/commodore8487 Luisa F. Giraldo C.
jaja, hola?

http://twitter.com/tancrackers John C
I got that message for another extension; I was using Chromium stable (ubuntu). I decided to download Chrome because of this.
http://twitter.com/tancrackers John C
I got that message for another extension; I was using Chromium stable (ubuntu). I decided to download Chrome because of this.
Dimitar Dimitrov
Using Chromium 11.0.696.57 (82915) and I got the same message. Google fails hard at detecting their own browser or they are trying to make me switch to Google Chrome which won’t happen. I would rather switch back to Firefox.

http://twitter.com/dbrenha daniel brenha
just saw this
http://www.google.com/support/forum/p/Chrome/thread?tid=72888892b8b68082&hl=en

Dimitar Dimitrov
I have just upgraded Chromium to 11.0.696.65 (84435) and it works now.

http://profiles.google.com/drew.dormann Drew Dormann
It should be noted that the actual overlay widgets (shown in the middle of the screen capture above) are absent.
You will get a thin orange scrollbar, but dragging that scrollbar will be more difficult.
http://nicoburns.com/myopenid Nico Burns
This is actually a webkit feature and will work on windows too. It is also possible for you to add this effect for anyone viewing your website in chrome.
https://launchpad.net/~andycandet Andy C.
I’m curious, does/will Firefox have support for overlay scrollbars?
On a side note, I believe the correct term is “voilá”, not “violá”.

http://twitter.com/Srphea Srphea
“voilà” to be exact (I’m a French speaker) :)

https://launchpad.net/~carbeck Carsten
Literally, ‘see there!’ (from what I remember of school French) ;)

Anonymous
Well, nowadays it means “there you go”, but yeah, it probably comes from “vois là”, and you translated this perfectly.

http://www.facebook.com/profile.php?id=100001238242597 Александр Анатольевич
Yeah! That’s really pretty! Waiting for real ayanta-scrollbars in chome. ^^
http://profiles.google.com/p4d573r Pad Ster
“thy’re cute, slim and awesome to use”
1 – It’s “they’re”
2 – I do not agree with this statement. They are not cute or awesome, as they violate the GTK theme and are just a single colour, not too creative. Themes are made to be used, and if Ubuntu is going to violate them, well, then I don’t like that. This is coming from a themer, I make scrollbars to be used, not discarded and replaced with some puny little ugly scrollbar.
I also don’t find them awesome to use. You seem to need to go over the scrollbar in a certain direction or the slider doesn’t come up (which doesn’t look good, in my opinion, and also violates the GTK theme).
Oh, but I do agree, they are “slim”, though I would rather describe them as “too skinny”.

http://profiles.google.com/pbaeyens31 Pablo Baeyens
Unity is just in an 1.0 version and now isn’t as changeable as it’ll be
(just read http://www.omgubuntu.co.uk/2011/05/mark-shuttleworth-talks-windicators-changes-for-unity-in-oneiric-and-whole-lot-more/)

http://profiles.google.com/p4d573r Pad Ster
But I don’t think you can customize overlay scrollbars. How would you customize them? With the GTK theme? Well, people already make those, but it overrides them. You mean change the colour, or what? It’s still pretty bad.

http://www.facebook.com/profile.php?id=36702211 thomas michael wallace
if you care so much- why not help develop a specification for allowing them to be themed? or even better, patch an implementation?

http://profiles.google.com/p4d573r Pad Ster
Well, I don’t know how to do any of that, I’m just expressing my opinion.
http://www.facebook.com/profile.php?id=36702211 thomas michael wallace
https://wiki.ubuntu.com/FeatureSpecifications
http://www.facebook.com/profile.php?id=36702211 thomas michael wallace
https://wiki.ubuntu.com/FeatureSpecifications

http://dylanmccall.blogspot.com/ dylan-m
The overlay scrollbars actually are coloured by the theme. Try changing your Gtk theme and you will see. I believe it uses the selection colour at the moment.
Contrary to popular belief, they are not part of Unity. You can find the project over here: https://launchpad.net/ayatana-scrollbar

http://profiles.google.com/p4d573r Pad Ster
I know they are coloured by the theme, but the theme doesn’t define how they look, etc. They are still ugly bits that don’t match the GTK theme.

http://pulse.yahoo.com/_FX5ITOLLHVNOY673XBRGCKF3DI Freddi
Why not use another theme?

http://profiles.google.com/p4d573r Pad Ster
Grr. I just said that the theme doesn’t matter, you can’t theme the overlay scrollbars. The theme would only change the colour and that’s not the point.
http://pulse.yahoo.com/_FX5ITOLLHVNOY673XBRGCKF3DI Freddi
If the scrollbar can’t be themed to fit the theme, choose a theme that matches the scrollbar.
http://pulse.yahoo.com/_FX5ITOLLHVNOY673XBRGCKF3DI Freddi
Sorry, don’t mind, I think now I understood what you wanted…
http://pulse.yahoo.com/_FX5ITOLLHVNOY673XBRGCKF3DI Freddi
If the scrollbar can’t be themed to fit the theme, choose a theme that matches the scrollbar.
http://pulse.yahoo.com/_FX5ITOLLHVNOY673XBRGCKF3DI Freddi
If the scrollbar can’t be themed to fit the theme, choose a theme that matches the scrollbar.
http://profiles.google.com/p4d573r Pad Ster
But they are ugly. That’s the point.
Anonymous
It’s subjective.
I think they look pretty, and the old style look bulky – I’ve never liked them.
http://www.manishsinha.net Manish Sinha
Please don’t enforce your views on others. You can be replied back as “They are pretty”. That’s the point.
http://profiles.google.com/p4d573r Pad Ster
@Manish Sinha: I’m just saying that they should be customizable or respect the GTK theme, because not everyone likes the look they currently have.
http://profiles.google.com/p4d573r Pad Ster
@haydoni: But you can make the “old style” look like that. It’s called GTK theming, which the “new style” violates.

http://twitter.com/josian_220 José Antonio
I don’t know why would hate these kind of scrollbars I really enjoy them. They make my desktop environment less cluttered.

http://profiles.google.com/p4d573r Pad Ster
They are ugly, violate the GTK theme, and are annoying/hard to use. To me, at least.
Proper scrollbars are straightforward, and easy to use. They can be themed and can look good, too.

http://twitter.com/josian_220 José Antonio
I still can’t see why you are complaining so much since it is easily removable, so the ones who enjoy it can use it and those who don’t have the option not to use them. Are you suggesting that they should not be implemented by default?

http://profiles.google.com/p4d573r Pad Ster
Well, I’m not sure just that I don’t like them. But I guess they should have it easily configurable. A little GUI or a section in the control centre for customizing things, like enable/disable overlay scrollbars, and the global menu, etc.
http://profiles.google.com/p4d573r Pad Ster
Well, I’m not sure just that I don’t like them. But I guess they should have it easily configurable. A little GUI or a section in the control centre for customizing things, like enable/disable overlay scrollbars, and the global menu, etc.

http://fitoschidoblog.wordpress.com Adolfo Jayme (Fitoschido)
Violate? We don’t urderstand the meaning of that word…

http://profiles.google.com/p4d573r Pad Ster
I mean they don’t respect the GTK theme, they ignore it and use their own style.
http://fitoschidoblog.wordpress.com Adolfo Jayme (Fitoschido)
Excuse me? Overlay scrollbars use GTK colors, I don’t know where it doesn’t respect the applied theme.
http://profiles.google.com/p4d573r Pad Ster
I mean they don’t respect the GTK theme, they ignore it and use their own style.
http://profiles.google.com/p4d573r Pad Ster
They use the colours, but that’s it. They completely ignore the theme’s GTK scrollbars created for the purpose of being scrollbars.

http://www.manishsinha.net Manish Sinha
The traditional scroll bars are even more ugly. Probably you are just adjusted to older ugliness.

http://profiles.google.com/p4d573r Pad Ster
What do you mean “the traditional scrollbars”? The “traditional scrollbars” were GTK-themed, and you could make them look like whatever you wanted. I’m sure there are scrollbars that don’t look ugly, and even if the only style you like is that of the overlay scrollbars, you could make the “traditional” ones look like that, too.
http://www.manishsinha.net Manish Sinha
I mean the default styling. They were thick and took a lot of space. Cimi is working on fixing the issues with overlay scrollbars. The first release is never perfect.
http://profiles.google.com/p4d573r Pad Ster
The default Ambience ones? They weren’t too big… But I guess that’s just my opinion.
http://www.manishsinha.net Manish Sinha
I do think they were too big. Again my opinion :)
http://profiles.google.com/p4d573r Pad Ster
The default Ambience ones? They weren’t too big… But I guess that’s just my opinion.

http://profiles.google.com/lerontolmachev Leron Tolmachev
But do they still highlight when you search with Ctrl+F?
Waldir Leôncio
Nice! Overlay scrollbars on browsers should be a priority, as it’s arguably the most important application on a computer nowadays.

http://pulse.yahoo.com/_FX5ITOLLHVNOY673XBRGCKF3DI Freddi
I definitely back your request. However Chromium never used native controls on Linux (while it does on other systems) because the developers couldn’t figure out how to do it. This has to do with the rendering order and the xserver.
So it is technically impossible to add real overlay scrollbars. The only possibility is to theme the scrollbar with css or to write a dirty javascript that adds a gripper in the website. But that wouldn’t be good for performance.

http://www.facebook.com/profile.php?id=1807442308 Joseph Abbey
I wish that ubuntu would just have chrome on their install disk, I think that it has a better browsing experience alot of times
yearoflinux.com

http://twitter.com/tardegrade tardegrade
In the interests of balance (and for my benefit.) Can we have an article on how to get rid of overlay scrollbars altogether please? I really dislike them. They are inconsistent, appearing inside and outside the window depending on position and size and fiddly.
I think a better implementation of the overlay approach I that used in iOS.

http://pulse.yahoo.com/_LOR655GR4ZFHCMSV7FW5ROPSAA Cliff W
I like the overlays, but I’ve found that they sometimes interfere with other UI elements. Specifically it can be difficult to drag a sash widget if it’s next to a scrollbar, since the overlay wants to grab focus before the sash can.
Anonymous
http://www.webupd8.org/2011/04/how-to-disable-overlay-scrollbars-in.html
To each his own.
Sam Illingworth
Isn’t it the same as the iOS implementation, except with added functionality for mouse users?

https://launchpad.net/~isantop Ian
Nope. You can always see the scrollbar. It’s only the gripper that appears and disappears.

Sam Illingworth
Ah – you mean you’d rather the scroll bar itself would disappear in Ubuntu? Yeah, I would too. Maybe it’ll be an option in 11.11, or somebody will patch it :)
I still think they’re the best scroll bars on any desktop OS right now though!

https://launchpad.net/~isantop Ian
Nope. You can always see the scrollbar. It’s only the gripper that appears and disappears.
https://launchpad.net/~isantop Ian
Nope. You can always see the scrollbar. It’s only the gripper that appears and disappears.

http://pulse.yahoo.com/_FX5ITOLLHVNOY673XBRGCKF3DI Freddi
see here: code.google.com/p/chromium/issues/detail?id=10949
Anonymous
I’m not sure why the extention needs access to my history
FYI from the comments:
it comes with some extra b***s**t. what the previous reviewer says it’s not a bug, it’s called ADWARE!
there is another problem: it’s hard to drag the scrollbar. a good approach for this is in ubuntu 11.04: a grippy should be displayed when hovered.
anonymous4 hours agoMark as spam
bug report…. if I type “t” in the omnibar, it says “Thin Scroll Bar”… this is very annoying since I have “t” already programmed for doing torrent searches, but now typing “t” shows “Thin Scroll Bar”… please fix this bug thanks.

http://pulse.yahoo.com/_LOR655GR4ZFHCMSV7FW5ROPSAA Cliff W
It probably doesn’t. If you’ve ever written a Chromium extension, you realize there’s no way to do it without generating that warning.
If you have doubts about what’s in the crx, just unpack it and take a look (iirc, it’s a 7zip file).

http://www.facebook.com/gmouraferreira Gabriel Moura Ferreira
This isnt a overlay scrollbar. Its just a thin scrollbar. Like the elementary extension for chrome. When the real overlay scrollbar outs, i install.
http://www.facebook.com/gmouraferreira Gabriel Moura Ferreira
This isnt a overlay scrollbar. Its just a thin scrollbar. Like the elementary extension for chrome. When the real overlay scrollbar outs, i install.
http://www.facebook.com/gmouraferreira Gabriel Moura Ferreira
This isnt a overlay scrollbar. Its just a thin scrollbar. Like the elementary extension for chrome. When the real overlay scrollbar outs, i install.
http://profiles.google.com/amakenadog Mario Martinez
what about firefox?
Anonymous
These scrollbars are awful. Yes they may look pretty but at the expense of usability – just like everything else in Unity.
- You can no longer click anywhere besides the gripper to quickly scroll to a given position. – The gripper doesn’t appear anywhere besides next to the highlighted area in the scrollbar so you can’t quickly jump to places
- The gripper doesn’t appear as quickly as I’d like. I have to mess around with my mouse over the top of the highlighted area a bit sometimes for it to show. This is frustrating!
But OH MY GOD we get 5px of extra screen real estate! SCREW USABILITY!
EDIT: For anyone wanting relieve themselves of this horrible ‘feature’:
sudo apt-get remove overlay-scrollbar
sudo su
echo “export LIBOVERLAY_SCROLLBAR=0″ > /etc/X11/Xsession.d/80overlayscrollbars
reboot

Anonymous
Here’s another thing that bugs me about those scrollbars : When your pointer is outside of a window, and you move in to the scrollbar, you actually have to move out again a bit to grab the scroll widget

http://profiles.google.com/johanob75 johan Öberg
Yes and to resize a window to the right you have to find a spot outside of that orange bar.

http://twitter.com/dbrenha daniel brenha
i always resize on right-down corner. never actually saw the resizing issue, but as for screen real estate the resolutions are not changing that fast, laptops keep going out the same as 3 years ago. personally i enjoy them just wanted them to have full support on all applications…
https://launchpad.net/~isantop Ian
Or hit the invisible 5-ish pixel border around the window.
https://launchpad.net/~isantop Ian
Or hit the invisible 5-ish pixel border around the window.

http://twitter.com/MarcCoquand Marc Coquand
To be honest they actually made me use scrollbars again, never used them before.
Anonymous
I don’t even think they look pretty. Just messy. I don’t see why with screen resolutions going UP, we need to focus on freeing up as much screen real estate as possible (and that’s what Unity seems to be going for above anything else)? It’s like they forgot that they were no longer developing Unity for Netbooks and just kept on going the way they were going. Hellooo!
Surely with the high-res screens we use nowadays screen real estate is not really an issue and we should instead be looking at ways to make things more useable/readable. For something that’s supposed to be all about taking the desktop experience forward, it seems like very backward thinking to me.
I mean not that you shouldn’t simplify where appropriate. Chromium’s interface is a great example of the right way to go about it*. But Unity just seems reckless. Removing things here, cramming things together there, hiding menus… Not good.
* That’s Chromium without the Unity scrollbars ;).

http://twitter.com/MotionShot Heimen Stoffels
I use a 23″ screen but still I wanna have as much space as possible. Does that make me weird now?

http://twitter.com/Emacs232 Denis Cheremisov
Are you using linux desktop at your job? How many hours per day are you using Linux?

http://profiles.google.com/sebastienfrade Sébastien FRADE MARANINCHI
Hum, I’m using linux nearly 15 hours per day and I think Ubuntu is going in a good way with Unity. Are you surprised?

http://twitter.com/Emacs232 Denis Cheremisov
Are you using linux desktop at your job? How many hours per day are you using Linux?
Anonymous
Yes if “as much as possible” means at the cost of usability. Space is good. But there’s a limit, and it has to be balanced against any possible consequences. If you want “as much space as possible”, maybe you should just get rid of the UI altogether… :S. But no… that would be silly wouldn’t it?
I’m just not convinced by Unity’s approach. Most of the changes just strike me as unnecessary. It’s like they’re trying too hard. The scrollbars for me are the worst of the bunch. Followed by the global menu, which I can understand for netbooks, but it just looks ugly on my 1920×1080 screen.
Maybe it’s all part of a larger vision, and maybe I’ll see it by the time 11.10 comes out? But for now, it’s a mess.

http://profiles.google.com/neojames11 James Bolton
Umm, I own a 1920 x 1080 screen and I love unity on it! It’s new features are great on my laptop, desktop and notebook! While I would like to see a few new changes it still makes great use of my screens no matter what size.

http://twitter.com/MotionShot Heimen Stoffels
I use a 23″ screen but still I wanna have as much space as possible. Does that make me weird now?
https://launchpad.net/~isantop Ian
It’s about User Content vs. UI Chrome, not screen real estate. They just aren’t being as extremist about it as Windows Phone 7.
https://launchpad.net/~isantop Ian
It’s about User Content vs. UI Chrome, not screen real estate. They just aren’t being as extremist about it as Windows Phone 7.
http://twitter.com/Afrodiseum N.C. Weber
But they are making Ubuntu for netbooks. And desktops, and laptops, and tablets, and smart phones… The plan is to make one Ubuntu for all devices, so there are going to be some ideas that will allow common use across the board. That said, I don’t like the new overlay scroll bars either. Thankfully, they don’t seem to work in Mozilla software.

http://shiba89.wordpress.com/ Shiba
Could you go troll somewhere else?

http://profiles.google.com/raybalhorn Ray Balhorn
actually, I found the information useful. I dont like them either
http://twitter.com/Emacs232 Denis Cheremisov
Could you shut up and listen to people who uses Linux all the time unlike you, who starts it once a day for an half of hour?
http://twitter.com/Emacs232 Denis Cheremisov
Could you shut up and listen to people who uses Linux all the time unlike you, who starts it once a day for an half of hour?

http://shiba89.wordpress.com/ Shiba
Could you go troll somewhere else?
Anonymous
well instead of just ranting, you could open bug reports to help improve them, in the long term will be better than for you having to remove them all the time.
Anonymous
well instead of just ranting, you could open bug reports to help improve them, in the long term will be better than for you having to remove them all the time.
http://myfreeweb.ru/ MyFreeWeb
Wait, people still use the scrollbar for something else than quickly looking at the current position in the document?! I thought everyone uses touch scrolling.

Anonymous
Yep, I don’t even understand why people still use scrollbar to actually scroll.

lynn van der hoek
this trick so sweet! old farts, you can go troll somewhere else, i use a fairly large dual desktop and hated the chunkiness of old chromium scrollbars, its both about real state and elegance. and dont tell me that you have been using computers since forever so u have higher moral authority. os’s and gui’s evolved: you didn’t. period.

http://twitter.com/Emacs232 Denis Cheremisov
Those scrollbars look like a joke, as well as Unity itself. BTW, about 100 people in the company I’m working for are using Ubuntu. NO ONE of them uses Unity. NO ONE.
As well as Gnome Shell.
We are looking at the dying linux desktop. We are about 1%. I guess it would be about 0.5-0.7% in 6 month.

http://profiles.google.com/cynicist Robert Rak
I’m using Unity and prefer it to Gnome 2 & 3. More configuration options would be nice but the defaults aren’t bad. I’m just hoping performance/stability is top notch on release, since the usability is great for me.

Dimitar Dimitrov
I wouldn’t use this. It adds some stupid tejji.com suggestions when you type ‘t’ in the address-bar. If you don’t believe me – take a look at the source-code of the extension.
http://pulse.yahoo.com/_M26FCBAJIBEUF3NPZF5M32VPRQ Wiki
I eventually found Unity quite exiting and effective, as soon as I selected the “never hide” option . As I cannot do that with the scrollbars (that’s the whole idea…), they are mostly a nuisance to me.
Usability should not have been so neglected, with the “hide” laucher and scrollbars : it takes ages to make them appear. It just doesn’t work.
Matthew Badsey
this could easily be turned into a Chrome App to be installed !, and the fade could be added and if needed the width could be extended so if the user put the cursor on the scrollbar it can add the few extra pixls to make it easer to scroll
floopy1962
great… is there a way to change the checkbox’s to something diferent then cleanlooks :D

How To Idea

Mimic the look of Ubuntu’s Overlay-scrollbars in Chrome/ium

Mimic Ubuntu 11.04 overlay-style scrollbars in Chrome/ium

Like us on Facebook!

Latest Comments

Our Most Popular Tweets

Mimic the look of Ubuntu’s Overlay-scrollbars in Chrome/ium

Mimic Ubuntu 11.04 overlay-style scrollbars in Chrome/ium

Most Read This Week

Like us on Facebook!

Latest Comments

Our Most Popular Tweets