
{"id":10007,"date":"2020-04-26T16:29:05","date_gmt":"2020-04-26T16:29:05","guid":{"rendered":"http:\/\/ubuntuhandbook.org\/?p=10007"},"modified":"2025-06-16T07:23:48","modified_gmt":"2025-06-16T07:23:48","slug":"dynamic-transparency-ubuntu-20-04","status":"publish","type":"post","link":"https:\/\/ubuntuhandbook.org\/index.php\/2020\/04\/dynamic-transparency-ubuntu-20-04\/","title":{"rendered":"Enable Top Panel Dynamic Transparency in Ubuntu"},"content":{"rendered":"<p><a href=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2023\/11\/gnome-logo-dark.webp\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2023\/11\/gnome-logo-dark-250x250.webp\" alt=\"\" width=\"250\" height=\"250\" class=\"alignleft size-thumbnail wp-image-44710\" srcset=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2023\/11\/gnome-logo-dark-250x250.webp 250w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2023\/11\/gnome-logo-dark-300x300.webp 300w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2023\/11\/gnome-logo-dark-600x600.webp 600w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2023\/11\/gnome-logo-dark-768x768.webp 768w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2023\/11\/gnome-logo-dark.webp 1200w\" sizes=\"auto, (max-width: 250px) 100vw, 250px\" \/><\/a><\/p>\n<p><b>Miss Ubuntu 18.04 style dynamic top panel transparency? Here&#8217;s how to enable this feature in Ubuntu 20.04, Ubuntu 22.04, Ubuntu 24.04 and 25.04 with default GNOME desktop.<\/b><\/p>\n<p>The top panel transparency feature was removed since Gnome 3.32. If you like, it easy to get back in all current GNOME editions (up to v48 so far) by installing an extension.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-10008\" src=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2020\/04\/dynamic-panel-transparency.gif\" alt=\"\" width=\"432\" height=\"270\" \/><\/p>\n<h3>For GNOME 43 and earlier<\/h3>\n<p>For Ubuntu 22.04, Ubuntu 20.04, and other Linux with GNOME older than v43, there&#8217;s a &#8220;Dynamic Panel Transparency&#8221; extension can do the job to fade your top panel to nothingness when there are no maximized windows present.<\/p>\n<p><b>1.<\/b> Open Firefox or Chrome browser and go to <a href=\"https:\/\/extensions.gnome.org\" target=\"_blank\" rel=\"noopener\">https:\/\/extensions.gnome.org<\/a>:<\/p>\n<p>Click the link text &#8220;click here to install browser extension&#8221; and follow the pop-ups to install the browser extension:<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-large wp-image-6794\" src=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2017\/05\/install-gnome-shell-browser-extension1-600x286.jpg\" alt=\"shell browser extension\" width=\"600\" height=\"286\" srcset=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2017\/05\/install-gnome-shell-browser-extension1-600x286.jpg 600w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2017\/05\/install-gnome-shell-browser-extension1-450x215.jpg 450w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2017\/05\/install-gnome-shell-browser-extension1-768x366.jpg 768w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2017\/05\/install-gnome-shell-browser-extension1.jpg 944w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><\/p>\n<p><b>2.<\/b> Then open terminal via <b>Ctrl+Alt+T<\/b> and run command:<\/p>\n<pre style=\"border: none;\">sudo apt install chrome-gnome-shell<\/pre>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-9943\" src=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2020\/04\/chrome-gshell.png\" alt=\"\" width=\"600\" height=\"139\" srcset=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2020\/04\/chrome-gshell.png 600w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2020\/04\/chrome-gshell-450x104.png 450w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><\/p>\n<p><b>3.<\/b> Go to <a href=\"https:\/\/extensions.gnome.org\/extension\/1011\/dynamic-panel-transparency\/\" target=\"_blank\" rel=\"noopener\">dynamic-panel-transparency\/<\/a> page, and use the ON\/OFF switch to install the extension.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-large wp-image-10009\" src=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2020\/04\/install-dynamictrans-600x366.jpg\" alt=\"\" width=\"600\" height=\"366\" srcset=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2020\/04\/install-dynamictrans-600x366.jpg 600w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2020\/04\/install-dynamictrans-450x274.jpg 450w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2020\/04\/install-dynamictrans-768x468.jpg 768w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2020\/04\/install-dynamictrans.jpg 904w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><\/p>\n<p>Finally, launch &#8220;<b>Extensions<\/b>&#8221; utility, turn on &#8216;Dynamic Panel Transparency&#8217; extension and configure it with following options:<\/p>\n<ul>\n<li>transition speed.<\/li>\n<li>custom panel opacity.<\/li>\n<li>foreground text color.<\/li>\n<li>per-app basis settings.<\/li>\n<\/ul>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-full wp-image-10011\" src=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2020\/04\/dynamic-trans-settings.png\" alt=\"\" width=\"600\" height=\"296\" srcset=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2020\/04\/dynamic-trans-settings.png 600w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2020\/04\/dynamic-trans-settings-450x222.png 450w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><\/p>\n<p>In addition, you may also adjust the left dock panel opacity (0.2 for example) by running command:<\/p>\n<pre style=\"border: none;\">gsettings set org.gnome.shell.extensions.dash-to-dock background-opacity 0.2<\/pre>\n<h3>For GNOME up to 48<\/h3>\n<p>The &#8220;Dynamic Panel Transparency&#8221; extension is no longer updated for recent GNOME. For users of Ubuntu 24.04, Ubuntu 24.10 and 25.04, use the <a href=\"https:\/\/extensions.gnome.org\/extension\/3960\/transparent-top-bar-adjustable-transparency\/\" target=\"_blank\">this extension<\/a> instead.<\/p>\n<p>Firstly, search &#038; install <b>Extension Manager<\/b> tool from App Center (filter by Debian package).<\/p>\n<div id=\"attachment_44419\" style=\"width: 610px\" class=\"wp-caption aligncenter\"><a href=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2023\/09\/extension-manager-inappcenter.webp\"><img loading=\"lazy\" decoding=\"async\" aria-describedby=\"caption-attachment-44419\" src=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2023\/09\/extension-manager-inappcenter-600x425.webp\" alt=\"\" width=\"600\" height=\"425\" class=\"size-large wp-image-44419\" srcset=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2023\/09\/extension-manager-inappcenter-600x425.webp 600w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2023\/09\/extension-manager-inappcenter-300x212.webp 300w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2023\/09\/extension-manager-inappcenter-768x544.webp 768w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2023\/09\/extension-manager-inappcenter.webp 989w\" sizes=\"auto, (max-width: 600px) 100vw, 600px\" \/><\/a><p id=\"caption-attachment-44419\" class=\"wp-caption-text\">Install Extension Manager in Ubuntu Software\/App Center<\/p><\/div>\n<p>Then launch the tool, navigate to <i>Browse<\/i> tab, finally search &#038; install the &#8220;Transparent Top Bar (Adjustable transparency)&#8221; extension:<\/p>\n<p><a href=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2020\/04\/transparent-topbar-adjust.webp\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2020\/04\/transparent-topbar-adjust-700x463.webp\" alt=\"\" width=\"610\" height=\"403\" class=\"aligncenter size-large wp-image-49103\" srcset=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2020\/04\/transparent-topbar-adjust-700x463.webp 700w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2020\/04\/transparent-topbar-adjust-300x198.webp 300w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2020\/04\/transparent-topbar-adjust-768x508.webp 768w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2020\/04\/transparent-topbar-adjust.webp 986w\" sizes=\"auto, (max-width: 610px) 100vw, 610px\" \/><\/a><\/p>\n<p>After installed the extension, navigate back to &#8220;Installed&#8221; tab, and click open its preferences dialog. Then, you can configure the top bar opacity, and disable dynamic transparency (opaque top bar when a window touches it) if you want. <\/p>\n<p><a href=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2020\/04\/topbar-opacity.webp\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2020\/04\/topbar-opacity-700x438.webp\" alt=\"\" width=\"610\" height=\"382\" class=\"aligncenter size-large wp-image-49104\" srcset=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2020\/04\/topbar-opacity-700x438.webp 700w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2020\/04\/topbar-opacity-300x188.webp 300w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2020\/04\/topbar-opacity-768x480.webp 768w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2020\/04\/topbar-opacity.webp 1009w\" sizes=\"auto, (max-width: 610px) 100vw, 610px\" \/><\/a><\/p>","protected":false},"excerpt":{"rendered":"<p>Miss Ubuntu 18.04 style dynamic top panel transparency? Here&#8217;s how to enable this feature in Ubuntu 20.04, Ubuntu 22.04, Ubuntu 24.04 and 25.04 with default GNOME desktop. The top panel transparency feature was removed since Gnome 3.32. If you like, it easy to get back in all current GNOME editions (up to v48 so far) [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[9],"tags":[1905],"class_list":["post-10007","post","type-post","status-publish","format-standard","hentry","category-howtos","tag-top-panel-transparency"],"_links":{"self":[{"href":"https:\/\/ubuntuhandbook.org\/index.php\/wp-json\/wp\/v2\/posts\/10007","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/ubuntuhandbook.org\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/ubuntuhandbook.org\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/ubuntuhandbook.org\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/ubuntuhandbook.org\/index.php\/wp-json\/wp\/v2\/comments?post=10007"}],"version-history":[{"count":0,"href":"https:\/\/ubuntuhandbook.org\/index.php\/wp-json\/wp\/v2\/posts\/10007\/revisions"}],"wp:attachment":[{"href":"https:\/\/ubuntuhandbook.org\/index.php\/wp-json\/wp\/v2\/media?parent=10007"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ubuntuhandbook.org\/index.php\/wp-json\/wp\/v2\/categories?post=10007"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ubuntuhandbook.org\/index.php\/wp-json\/wp\/v2\/tags?post=10007"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}