
{"id":47235,"date":"2024-09-16T08:11:05","date_gmt":"2024-09-16T08:11:05","guid":{"rendered":"https:\/\/ubuntuhandbook.org\/?p=47235"},"modified":"2025-08-10T04:35:11","modified_gmt":"2025-08-10T04:35:11","slug":"floating-bar-ubuntu-24-04","status":"publish","type":"post","link":"https:\/\/ubuntuhandbook.org\/index.php\/2024\/09\/floating-bar-ubuntu-24-04\/","title":{"rendered":"Enable KDE Plasma 6 Style Floating Bar in Ubuntu 24.04"},"content":{"rendered":"<p><a href=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2023\/11\/gnome-logo-dark.webp\"><img loading=\"lazy\" decoding=\"async\" class=\"alignleft size-thumbnail wp-image-44710\" src=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2023\/11\/gnome-logo-dark-250x250.webp\" alt=\"\" width=\"250\" height=\"250\" 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>This tutorial shows how to enable floating top panel in Ubuntu 24.04, Fedora 40, Arch, Manjaro and other Linux with GNOME 46\/47 Desktop.<\/p>\n<p>Unlike traditional system panel which is usually stick to screen edge, floating bar (or panel) looks kinda like a desktop widget. It floats on the desktop, and usually has a small distance from the top or bottom edge.<\/p>\n<p>Some systems, such as Windows 11, Zorin OS, Deepin Linux, include options to enable floating taskbar. The KDE Plasma 6 desktop even use it as default, which also automatically switches to solid panel style, when a window approaches or is maximized.<\/p>\n<div style=\"width: 610px;\" class=\"wp-video\"><video class=\"wp-video-shortcode\" id=\"video-47235-1\" width=\"610\" height=\"343\" preload=\"metadata\" controls=\"controls\"><source type=\"video\/webm\" src=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2024\/09\/floating-bar.webm?_=1\" \/><a href=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2024\/09\/floating-bar.webm\">https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2024\/09\/floating-bar.webm<\/a><\/video><\/div>\n<p><!--more--><\/p>\n<p>GNOME, the default desktop for Ubuntu and Fedora Workstation, can now enable KDE Plasma 6 style floating bar via an extension. Here&#8217;s how to install and set it up in Ubuntu 24.04 LTS.<\/p>\n<p>Besides <strong>floating top bar<\/strong>\u00a0and <strong>auto-switch to solid style when windows approach<\/strong>, the extension also features:<\/p>\n<ul>\n<li>Automatically switch between light or dark color, according to desktop light\/dark style.<\/li>\n<li>panel transparency (Opacity)<\/li>\n<li>Round border and radius.<\/li>\n<li>Panel width and position (left, right, or center)<\/li>\n<li>Base Margin (how far it goes from the screen edge)<\/li>\n<\/ul>\n<div id=\"attachment_47239\" style=\"width: 620px\" class=\"wp-caption aligncenter\"><a href=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2024\/09\/floating-bar-noble.webp\"><img loading=\"lazy\" decoding=\"async\" aria-describedby=\"caption-attachment-47239\" class=\"size-large wp-image-47239\" src=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2024\/09\/floating-bar-noble-700x394.webp\" alt=\"\" width=\"610\" height=\"343\" srcset=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2024\/09\/floating-bar-noble-700x394.webp 700w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2024\/09\/floating-bar-noble-300x169.webp 300w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2024\/09\/floating-bar-noble-768x432.webp 768w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2024\/09\/floating-bar-noble-1536x864.webp 1536w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2024\/09\/floating-bar-noble-1320x743.webp 1320w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2024\/09\/floating-bar-noble.webp 1920w\" sizes=\"auto, (max-width: 610px) 100vw, 610px\" \/><\/a><p id=\"caption-attachment-47239\" class=\"wp-caption-text\">Semi-transparent floating panel shorten in center<\/p><\/div>\n<h3>Step 1: Install the Dynamic Panel extension<\/h3>\n<p><b>NOTE: The extension MAY NOT work well with other extensions, such as Just Perfection, Hide Top Bar.<\/b><\/p>\n<p>The feature is implemented by the &#8220;Dynamic Panel&#8221; extension, which so far supports GNOME 46 and 47.<\/p>\n<p><b>Ubuntu 24.04<\/b> user can first search for and install &#8220;Extension Manager&#8221; 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\" class=\"size-large wp-image-44419\" src=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2023\/09\/extension-manager-inappcenter-600x425.webp\" alt=\"\" width=\"600\" height=\"425\" 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 &#8220;Extension Manager&#8221; and navigate to &#8220;Browse&#8221; tab. Finally, search &amp; install the &#8220;Dynamic Panel&#8221; extension.<\/p>\n<div id=\"attachment_47237\" style=\"width: 620px\" class=\"wp-caption aligncenter\"><a href=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2024\/09\/install-floatingpanel-em.webp\"><img loading=\"lazy\" decoding=\"async\" aria-describedby=\"caption-attachment-47237\" class=\"size-large wp-image-47237\" src=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2024\/09\/install-floatingpanel-em-700x497.webp\" alt=\"\" width=\"610\" height=\"433\" srcset=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2024\/09\/install-floatingpanel-em-700x497.webp 700w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2024\/09\/install-floatingpanel-em-300x213.webp 300w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2024\/09\/install-floatingpanel-em-768x546.webp 768w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2024\/09\/install-floatingpanel-em.webp 915w\" sizes=\"auto, (max-width: 610px) 100vw, 610px\" \/><\/a><p id=\"caption-attachment-47237\" class=\"wp-caption-text\">Install &#8220;Dynamic Panel&#8221; extension with Extension Manager<\/p><\/div>\n<p><b>Other Linux<\/b> can just go to the extension page in EGO via the link button below:<\/p>\n<div class=\"wp-block-buttons aligncenter\">\n<div class=\"wp-block-button is-style-fill\"><a class=\"wp-block-button__link has-vivid-cyan-blue-to-vivid-purple-gradient-background has-text-color has-background\" href=\"https:\/\/extensions.gnome.org\/extension\/7284\/dynamic-panel\/\" target=\"_blank\" rel=\"noreferrer noopener\">Dynamic Panel in EGO<\/a><\/div>\n<\/div>\n<p>Then, use the ON\/OFF toggle switch to install the extension. If you don&#8217;t see the switch, click the link in that page to install the browser extension and refresh.<\/p>\n<p><a href=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2024\/09\/install-floatingpanel-web.webp\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-large wp-image-47238\" src=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2024\/09\/install-floatingpanel-web-700x482.webp\" alt=\"\" width=\"610\" height=\"420\" srcset=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2024\/09\/install-floatingpanel-web-700x482.webp 700w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2024\/09\/install-floatingpanel-web-300x207.webp 300w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2024\/09\/install-floatingpanel-web-768x529.webp 768w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2024\/09\/install-floatingpanel-web.webp 1225w\" sizes=\"auto, (max-width: 610px) 100vw, 610px\" \/><\/a><\/p>\n<h3>Step 2: Configure the floating bar<\/h3>\n<p>The top panel should change immediately after successfully installed the extension.<\/p>\n<p>To change the panel opacity, length, border radius, margin, etc., launch either <b>Extension Manger<\/b> or <b>GNOME Extensions<\/b> app, and click either setting button or icon for the extension to open its <i>Preferences<\/i> dialog.<\/p>\n<p><a href=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2024\/09\/configure-dynamic-panel.webp\"><img loading=\"lazy\" decoding=\"async\" class=\"aligncenter size-large wp-image-47240\" src=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2024\/09\/configure-dynamic-panel-700x544.webp\" alt=\"\" width=\"610\" height=\"474\" srcset=\"https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2024\/09\/configure-dynamic-panel-700x544.webp 700w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2024\/09\/configure-dynamic-panel-300x233.webp 300w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2024\/09\/configure-dynamic-panel-768x597.webp 768w, https:\/\/ubuntuhandbook.org\/wp-content\/uploads\/2024\/09\/configure-dynamic-panel.webp 1085w\" sizes=\"auto, (max-width: 610px) 100vw, 610px\" \/><\/a><\/p>\n<h3>Uninstall:<\/h3>\n<p>To uninstall this floating panel extension, either open &#8220;Extension Manager&#8221;\/&#8221;Gnome Extensions&#8221; app, click expand the extension and finally use &#8220;Remove&#8221; button to uninstall.<\/p>\n<p>Or, just go to the extension web page via the link button above, and turn off the toggle switch to uninstall.<\/p>","protected":false},"excerpt":{"rendered":"<p>This tutorial shows how to enable floating top panel in Ubuntu 24.04, Fedora 40, Arch, Manjaro and other Linux with GNOME 46\/47 Desktop. Unlike traditional system panel which is usually stick to screen edge, floating bar (or panel) looks kinda like a desktop widget. It floats on the desktop, and usually has a small distance [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":44710,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[9],"tags":[689],"class_list":["post-47235","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-howtos","tag-gnome"],"_links":{"self":[{"href":"https:\/\/ubuntuhandbook.org\/index.php\/wp-json\/wp\/v2\/posts\/47235","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=47235"}],"version-history":[{"count":0,"href":"https:\/\/ubuntuhandbook.org\/index.php\/wp-json\/wp\/v2\/posts\/47235\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/ubuntuhandbook.org\/index.php\/wp-json\/wp\/v2\/media\/44710"}],"wp:attachment":[{"href":"https:\/\/ubuntuhandbook.org\/index.php\/wp-json\/wp\/v2\/media?parent=47235"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/ubuntuhandbook.org\/index.php\/wp-json\/wp\/v2\/categories?post=47235"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/ubuntuhandbook.org\/index.php\/wp-json\/wp\/v2\/tags?post=47235"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}