Vivaldi customizations allow things like this: Show panel on hover

Vivaldi and his panel

Vivaldi It is one of the browsers that gives users the most freedom, both in the form of functions and customization. Not only does it allow you to use themes and edit the rounding of the tabs, among other things; It also allows us to create a configuration file from which to edit any part of the browser.

What we are going to show you today is something that some users have requested in the browser forum, but that is not implemented at this time. Vivaldi allows you to hide the side panel with F4, and also has an option in the form of a small tab that will show the panel when clicked. What would be missing to complete the circle is that this panel only appears if we hover over it, and we are going to explain a way to achieve it.

Vivaldi modification that might interest you

En this article we explain how activate the option to edit any part of the browser and how to create a file for these purposes. In short, the option is activated in vivaldi://experiments/, the folder where we will put these modifications is indicated and a .css file is created with the changes that interest us.

To ensure that the side panel is hidden and appears when doing what is known as hover, at some point in that file we have to add something like this:

#panels-container { opacity: 0; width: 1px !important; transition: 0.3s !important } #panels-container:hover { opacity: 1; width: 35px !important }

Explaining what we have done

The panels are in a container, a Vivaldi element called panels-container. In the first part we make it have an opacity of 0, that is, it is completely transparent, and we give it a width of at least 1px, so that it exists and there is something to pass the cursor over. In the second, which is for when we do that hover, the opacity will become 1 – fully visible – and we will give it the normal width, which by default and on all the devices I have looked at is 35px.

There is something else left, and it is a transition. It's optional, but if you add that part, the panel will appear from the edge and give it an effect that's cool... if you like it.

Other options

If you know the language of CSS, and as we already explained at the time, the possibilities are virtually endless. Another example that occurs to me for what is explained here is to set a height of a few pixels so that the effect is from left to right and from bottom to top or the opposite. But it is something that I do not recommend because finding the exact point over which to hover the cursor would be difficult. There are also other ways to get the panel, and I have seen some on the forums and in Reddit. But most use more lines of CSS and on top of that they leave a border without a panel visible in the place where it should be, which gains little.

And speaking of options, I'll also tell you my choice: although I agree that it would be nice to have the panel appear when you move the cursor over the edge, I think that It has to be better implemented. What we have explained here is a fix that does nothing more than that: something that does what we want and gets us out of "trouble." Furthermore, if what we miss is a window that goes from side to side without a panel, we can make it "go away" by pressing F4 as we explained at the beginning of this note.

So what I did in the end was try to change it on my own, share it in case it helps someone and stay with what the default browser offers me. Who knows, if in the future its developers decide that it is a good idea and offer something better, maybe I, like many others, will use the function. Vivaldi will continue doing what it does: offering options.

Leave a Comment

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



  1. Responsible for the data: AB Internet Networks 2008 SL
  2. Purpose of the data: Control SPAM, comment management.
  3. Legitimation: Your consent
  4. Communication of the data: The data will not be communicated to third parties except by legal obligation.
  5. Data storage: Database hosted by Occentus Networks (EU)
  6. Rights: At any time you can limit, recover and delete your information.