Enable Top Panel Dynamic Transparency in Ubuntu 20.04

gnome shell

Miss Ubuntu 18.04 style dynamic top panel transparency? Here’s how to get this function in Ubuntu 20.04 gnome shell.

Although top panel transparency was removed since Gnome 3.32, you can get the feature back via ‘Dynamic Panel Transparency‘ gnome shell extension.

The extension fades your top panel to nothingness when there are no maximized windows present. With extension settings, you can also:

  • change transition speed.
  • set custom panel opacity.
  • change foreground text color.
  • per-app basis settings.

[ac-box style=”tip”]If you’re first time installing gnome shell extension in Ubuntu 20.04, you may need to do the first two steps to setup GNOME Shell extensions integration for web browsers.[/ac-box]

1. Open Firefox or Google Chrome and go to https://extensions.gnome.org:

Click the link text “click here to install browser extension” and follow the pop-ups to install the browser extension:

2. Then open terminal via Ctrl+Alt+T and run command:

sudo apt install chrome-gnome-shell

3. Go to dynamic-panel-transparency/ page, and click the toggle to install the extension.

4. The extension is not updated for Gnome 3.36 at the moment. If you see an error, run command in terminal:

gedit ~/.local/share/gnome-shell/extensions/dynamic-panel-transparency@rockon999.github.io/intellifade.js

And in pop-up text editor, find out and change following lines:

let anchor_y = -Main.layoutManager.panelBox.get_anchor_point()[1];
let pivot_y = -Main.layoutManager.panelBox.get_pivot_point()[1];

if (anchor_y > 0) {
this.panel_bounds.y = anchor_y;
this.panel_bounds.is_top = false;
} else if (pivot_y > 0) {
this.panel_bounds.y = pivot_y;
this.panel_bounds.is_top = false;


let pivot_y = -Main.layoutManager.panelBox.get_pivot_point()[1];

if (pivot_y > 0) {
this.panel_bounds.y = pivot_y;
this.panel_bounds.is_top = false;

Save the file. And restart Gnome Shell by pressing Alt+F2 on keyboard, typing “r” (without quotes) and hit Enter.

Finally, launch “Extensions” utility, turn on ‘Dynamic Panel Transparency’ extension and change its settings and enjoy!

In addition, you may also adjust the left dock panel opacity by running command (change 0.2 in the code):

gsettings set org.gnome.shell.extensions.dash-to-dock background-opacity 0.2

By Ji m

I'm a freelance blogger who started using Ubuntu in 2007 and wishes to share my experiences and some useful tips with Ubuntu beginners and lovers. Please comment to remind me outdated tutorial! And, notify me if you find any typo/grammar/language mistakes. English is not my native language. Contact me via ubuntuhandbook1@gmail.com Buy me a coffee: https://ko-fi.com/ubuntuhandbook1


  1. Bingo.
    Finally works for me on 20.04 LTS

    I was scared shitless, through the whole thing, and every time I get started I wish that the author would have discussed the “recovery plan” for me if their plan disn’t actually work for me on my hardware – just saying.
    Virgins need handholding.

    Anyway, you nailed it, your “How To” not only worked but was confidence inspiring enough for me to risk it if I bricked it. ;)

  2. Mr. Ji, a big “THANK YOU” from Brazil! So much happy now with my Pop! OS desktop!

Comments are closed.

Exit mobile version