Change the "text selection" or "highlight" color

Here is the thing, I use Vivaldi as my main browser, the only thing that I don't like about the Zorin theme is the highlight color that uses to select color.


In the image I select the url of the forum and I can barely see what I selected. Is there any way to change that color to any that can be more visible?

I use Zorin Core (Gnome). Thanks in advance.

In ~/.config/gtk-3.0/ directory, create a text file named gtk.css and paste the following into it:

 .nemo-window rubberband, .nemo-window flowbox rubberband, .nemo-window treeview.view rubberband, .nemo-window .content-view rubberband, .nemo-window .rubberband, .thunar rubberband, .thunar .rubberband, .content-view.view.rubberband, .view.rubberband, flowbox rubberband, rubberband, .rubberband, rubberband, XfdesktopIconView.view .rubberband, .content-view rubberband, .content-view .rubberband, treeview.view rubberband {
     background-color: rgba(0, 195, 255, 0.3);
     border: 1px solid #000;

You can change the rgba color as desired.

Restart your browser. Log out and in or tap alt+f2 and enter in r to see the change.

1 Like


But it didn't change anything, the highlight color is the same

Please ensure that Vivaldi is set to use the gtk theme.
Setings > Appearance > Use Native Window

You may test if it is Vivaldi by testing if the color changed for highlighted text in other applications or windows.

Nope, it didn't change anything, the color still the same including evince and gedit.

Evince and Gedit both do not use the system theme to choose text highlight color. They both contain their own. I prefer to use Xed, in which you can use your own custom theme and colors (I have made several that are floating around the web as downloadable themes.)
You happened to pick two apps that wouldn't show the change. :wink:

I went through this not long ago with user @Frog on changing the same exact detail in Vivaldi browser. Let me see if I can find that thread and what we ultimately did...

EDIT: That thread is here:

We ultimately used Vivaldi Experimental to retheme Vivaldi. However, going to Settings > Appearance > Themes may be all you need to do - try a different theme.

Unfortunately mine has reverted back to the black on black highlighting .... I just left it alone and got used to not seeing what I am highlighting on the board .... :roll_eyes:

Well, join in this thread and let's see if we can restore yours. Sounds like a Vivaldi Update pushed through that changed your settings. (This is one of two very good reasons I do not use Vivaldi, anymore).

Yeah, I think I will do that, is the easiest way

But I'm thinking where is the difference in the theme, In the past two weeks I distro hopped a lot, and I saw that Vivaldi in Mint with the default theme didn't have this problem, the highlight color was their "brand" mint green, so I'm thinking that is the theme and an issue with Vivaldi.

Anyway, thanks for helping

One way to test this on Zorin OS is to try using a third-party theme and see if that shows the highlight. If it does... Then it narrows it down to being likely the Zorin Theme in combination with Vivaldi.
I have Vivaldi installed for testing purposes and have it open, now.
I will need to Undo My Custom theme in Vivaldi to test this against the Zorin Themes, so this may take a few minutes...
We also could give you that custom theme, as we did with Frog, in order to solve your issue.

EDIT: Yes, just tested Vivaldi using default config with Zorin-Grey-Dark
Cannot see highlighted text.
Switched my gtk theme to Azenis2021 and then was able to see highlighted text in a Blue Highlight color.
In This Case the above tip in post number 2 really should have worked. Did you ensure the file was saved properly, with the correct placement and name? Did you restart Vivaldi browser?

Yes I did that

There is a screenshot, unless I did something wrong...

1 Like

Or unless I did... :neutral_face:

.view:hover, iconview:hover, .view:hover:focus, iconview:hover:focus, .view text:hover, iconview text:hover, textview text:hover, iconview text:hover:focus, textview text:hover:focus, flowbox flowboxchild:hover, row:hover, .view:selected, iconview:selected, .view:selected:focus, iconview:selected:focus, .view text:selected, iconview text:selected, textview text:selected, iconview text:selected:focus, textview text:selected:focus, .view text selection:focus, iconview text selection:focus, .view text selection, iconview text selection, textview text selection:focus, textview text selection, flowbox flowboxchild:selected, entry selection, entry selection:focus, row:selected {
     background-color: rgba(0, 170, 255, 0.5);

Hey, can we get the busboy in here to clean up post number two?

1 Like

Finally, thank you a lot! This is the answer :smiley:

1 Like

@Frog, this should help you, too.

Welcome to the Zorin Forum. I will be happy to help you all kinds of wrong until I get it right. Well... those styles both deal with Highlight Color... (cough)

In the meantime, I will push this toward @zorink and @AZorin so they can adjust the Zorin Themes and release that in an update to Zorin OS.
Please Keep an eye on Updates as they come in; if you see updates for Zorin-Themes, you will be able to comment out or remove the custom gtk.css in ~/.config/gtk-3.0 and rely only on the Zorin Themes from that point forward.

1 Like

This topic was automatically closed 90 days after the last reply. New replies are no longer allowed.