diff --git a/src/bundle/Resources/encore/ibexa.js.config.js b/src/bundle/Resources/encore/ibexa.js.config.js
index 47830e5ab7..f20be70610 100644
--- a/src/bundle/Resources/encore/ibexa.js.config.js
+++ b/src/bundle/Resources/encore/ibexa.js.config.js
@@ -49,6 +49,7 @@ const layout = [
     path.resolve(__dirname, '../public/js/scripts/admin.distraction.free.mode.js'),
     path.resolve(__dirname, '../public/js/scripts/admin.focus.mode.js'),
     path.resolve(__dirname, '../public/js/scripts/sidebar/main.menu.js'),
+    path.resolve(__dirname, '../public/js/scripts/admin.app.switcher.js'),
     path.resolve(__dirname, '../public/js/scripts/admin.input.text.js'),
     path.resolve(__dirname, '../public/js/scripts/admin.table.js'),
     path.resolve(__dirname, '../public/js/scripts/core/collapse.js'),
diff --git a/src/bundle/Resources/public/js/scripts/admin.app.switcher.js b/src/bundle/Resources/public/js/scripts/admin.app.switcher.js
new file mode 100644
index 0000000000..f6e584fc07
--- /dev/null
+++ b/src/bundle/Resources/public/js/scripts/admin.app.switcher.js
@@ -0,0 +1,60 @@
+(function (global, doc) {
+    const CLASS_PANEL_HIDDEN = 'ibexa-app-switcher-panel--hidden';
+    const CLASS_TOGGLER_COLUMN_OPEN = 'ibexa-main-header__app-switcher-column--open';
+    const SELECTOR_TOGGLER = '.ibexa-app-switcher-toggler';
+    const SELECTOR_TOGGLER_COLUMN = '.ibexa-main-header__app-switcher-column';
+    const toggler = doc.querySelector(SELECTOR_TOGGLER);
+
+    if (!toggler) {
+        return;
+    }
+
+    const panel = doc.getElementById(toggler.getAttribute('aria-controls'));
+    const togglerColumn = toggler.closest(SELECTOR_TOGGLER_COLUMN);
+
+    if (!panel || !togglerColumn) {
+        return;
+    }
+
+    const isOpen = () => !panel.classList.contains(CLASS_PANEL_HIDDEN);
+    const setOpen = (shouldBeOpen) => {
+        panel.classList.toggle(CLASS_PANEL_HIDDEN, !shouldBeOpen);
+        togglerColumn.classList.toggle(CLASS_TOGGLER_COLUMN_OPEN, shouldBeOpen);
+        toggler.setAttribute('aria-expanded', shouldBeOpen ? 'true' : 'false');
+    };
+    const close = ({ shouldRestoreFocus = false } = {}) => {
+        setOpen(false);
+
+        if (shouldRestoreFocus) {
+            toggler.focus();
+        }
+    };
+
+    toggler.addEventListener(
+        'click',
+        () => {
+            setOpen(!isOpen());
+        },
+        false,
+    );
+
+    doc.addEventListener(
+        'keydown',
+        (event) => {
+            if (event.key === 'Escape' && isOpen()) {
+                close({ shouldRestoreFocus: true });
+            }
+        },
+        false,
+    );
+
+    doc.addEventListener(
+        'click',
+        (event) => {
+            if (isOpen() && !panel.contains(event.target) && !toggler.contains(event.target)) {
+                close();
+            }
+        },
+        false,
+    );
+})(window, window.document);
diff --git a/src/bundle/Resources/public/scss/_app-switcher.scss b/src/bundle/Resources/public/scss/_app-switcher.scss
new file mode 100644
index 0000000000..323a16e90b
--- /dev/null
+++ b/src/bundle/Resources/public/scss/_app-switcher.scss
@@ -0,0 +1,160 @@
+@use '@ibexa-admin-ui/src/bundle/Resources/public/scss/custom.scss' as *;
+@use '@ibexa-admin-ui/src/bundle/Resources/public/scss/functions/calculate.rem' as *;
+
+.ibexa-app-switcher {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+
+    &__list {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        width: 100%;
+        margin: 0;
+        padding: 0;
+        list-style: none;
+    }
+
+    &__item {
+        display: flex;
+        justify-content: center;
+        width: 100%;
+    }
+
+    &__link {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        justify-content: center;
+        text-decoration: none;
+    }
+
+    &__link-text {
+        text-align: center;
+    }
+
+    &--login {
+        flex: 0 0 calculateRem(64px);
+        padding-block: calculateRem(32px);
+        background-color: $ibexa-color-black;
+
+        .ibexa-app-switcher {
+            &__list {
+                gap: calculateRem(8px);
+            }
+
+            &__link {
+                gap: calculateRem(2px);
+                width: calculateRem(64px);
+                height: calculateRem(64px);
+                padding-block: calculateRem(8px);
+                color: $ibexa-color-white;
+
+                &:hover {
+                    color: $ibexa-color-primary;
+                }
+            }
+
+            &__link--active {
+                background-color: $ibexa-color-white;
+                color: $ibexa-color-black;
+
+                &:hover {
+                    color: $ibexa-color-black;
+                }
+            }
+
+            &__link-icon {
+                width: calculateRem(32px);
+                height: calculateRem(32px);
+            }
+
+            &__link-text {
+                font-size: calculateRem(10px);
+                line-height: calculateRem(15px);
+            }
+        }
+    }
+
+    &--panel {
+        width: calculateRem(64px);
+
+        .ibexa-app-switcher {
+            &__list {
+                gap: calculateRem(12px);
+                padding-block: calculateRem(12px);
+                padding-inline: calculateRem(8px);
+            }
+
+            &__link {
+                width: calculateRem(48px);
+                height: calculateRem(48px);
+                padding-block: calculateRem(8px);
+                border-radius: calculateRem(8px);
+                color: $ibexa-color-black;
+
+                &:hover {
+                    background-color: $ibexa-color-light-400;
+                }
+            }
+
+            &__link--active {
+                background-color: $ibexa-color-light-400;
+            }
+
+            &__link-icon {
+                width: calculateRem(20px);
+                height: calculateRem(20px);
+            }
+
+            &__link-text {
+                font-size: calculateRem(9px);
+                line-height: calculateRem(15px);
+                letter-spacing: calculateRem(0.12px);
+            }
+        }
+    }
+}
+
+.ibexa-app-switcher-panel {
+    flex: 0 0 auto;
+    width: calculateRem(64px);
+    overflow: hidden;
+    background-color: $ibexa-color-white;
+    transition: width $ibexa-admin-transition-duration $ibexa-admin-transition;
+
+    &::before {
+        content: '';
+        display: block;
+        width: calculateRem(48px);
+        height: calculateRem(1px);
+        margin-inline: auto;
+        background-color: $ibexa-color-light;
+    }
+
+    &--hidden {
+        width: 0;
+    }
+
+    @media (prefers-reduced-motion: reduce) {
+        transition: none;
+    }
+}
+
+.ibexa-app-switcher-toggler {
+    width: calculateRem(40px);
+    height: calculateRem(40px);
+
+    &.ids-btn {
+        --ids-default-text-color: #{$ibexa-color-white};
+        --ids-focus-text-color: #{$ibexa-color-white};
+        --ids-hover-text-color: #{$ibexa-color-white};
+        --ids-hover-bg-color: #{$ibexa-color-dark-500};
+    }
+
+    .ids-icon {
+        width: calculateRem(24px);
+        height: calculateRem(24px);
+    }
+}
diff --git a/src/bundle/Resources/public/scss/_login.scss b/src/bundle/Resources/public/scss/_login.scss
index 2e9a73414d..aa5269c245 100644
--- a/src/bundle/Resources/public/scss/_login.scss
+++ b/src/bundle/Resources/public/scss/_login.scss
@@ -23,47 +23,9 @@
         background-repeat: no-repeat;
     }
 
-    &__sidebar {
+    .ibexa-app-switcher--login {
         position: relative;
         z-index: 1;
-        flex: 0 0 calculateRem(64px);
-        border-right: calculateRem(1px) solid $ibexa-color-light;
-        background: $ibexa-color-black;
-    }
-
-    &__sidebar-nav {
-        display: flex;
-        flex-direction: column;
-        gap: calculateRem(8px);
-        list-style: none;
-        margin: 0;
-        padding: calculateRem(32px) 0 0;
-    }
-
-    &__sidebar-link {
-        display: flex;
-        flex-direction: column;
-        align-items: center;
-        justify-content: center;
-        width: 100%;
-        height: calculateRem(64px);
-        text-decoration: none;
-        color: $ibexa-color-white;
-
-        &:hover {
-            color: $ibexa-color-primary;
-        }
-    }
-
-    &__sidebar-link-icon {
-        width: calculateRem(24px);
-        height: calculateRem(24px);
-    }
-
-    &__sidebar-link-text {
-        text-align: center;
-        font-size: calculateRem(10px);
-        margin-top: calculateRem(4px);
     }
 
     &__panel {
diff --git a/src/bundle/Resources/public/scss/_main-header.scss b/src/bundle/Resources/public/scss/_main-header.scss
index 0f6e7735bf..a3277e945e 100644
--- a/src/bundle/Resources/public/scss/_main-header.scss
+++ b/src/bundle/Resources/public/scss/_main-header.scss
@@ -7,6 +7,7 @@
     width: 100%;
     display: flex;
     justify-content: space-between;
+    gap: calculateRem(16px);
     padding: calculateRem(16px) calculateRem(20px) calculateRem(15px);
     background: $ibexa-color-dark;
     border-bottom: calculateRem(1px) solid $ibexa-color-dark-500;
@@ -15,6 +16,51 @@
         z-index: auto;
     }
 
+    &__app-switcher-column {
+        position: relative;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        flex: 0 0 calculateRem(64px);
+        margin: calculateRem(-16px) 0 calculateRem(-16px) calculateRem(-20px);
+
+        &::before {
+            content: '';
+            position: absolute;
+            z-index: -1;
+            top: 0;
+            bottom: 0;
+            left: 0;
+            width: 0;
+            background-color: $ibexa-color-white;
+            transition: width $ibexa-admin-transition-duration $ibexa-admin-transition;
+        }
+
+        .ibexa-app-switcher-toggler .ids-icon {
+            transition: fill $ibexa-admin-transition-duration $ibexa-admin-transition;
+        }
+
+        &--open {
+            &::before {
+                width: 100%;
+            }
+
+            .ibexa-app-switcher-toggler.ids-btn {
+                --ids-default-text-color: #{$ibexa-color-black};
+                --ids-focus-text-color: #{$ibexa-color-black};
+                --ids-hover-text-color: #{$ibexa-color-black};
+                --ids-hover-bg-color: #{$ibexa-color-light-400};
+            }
+        }
+
+        @media (prefers-reduced-motion: reduce) {
+            &::before,
+            .ibexa-app-switcher-toggler .ids-icon {
+                transition: none;
+            }
+        }
+    }
+
     &__brand-column {
         flex: 1;
         display: flex;
diff --git a/src/bundle/Resources/public/scss/ibexa.scss b/src/bundle/Resources/public/scss/ibexa.scss
index 6f03af90b9..d6f10ea86f 100644
--- a/src/bundle/Resources/public/scss/ibexa.scss
+++ b/src/bundle/Resources/public/scss/ibexa.scss
@@ -5,6 +5,7 @@
 @use 'mixins';
 @use 'general';
 @use 'adaptive-filters';
+@use 'app-switcher';
 @use 'backdrop';
 @use 'tabs';
 @use 'tables';
diff --git a/src/bundle/Resources/translations/ibexa_menu.en.xliff b/src/bundle/Resources/translations/ibexa_menu.en.xliff
index d91e783c68..212d51b52b 100644
--- a/src/bundle/Resources/translations/ibexa_menu.en.xliff
+++ b/src/bundle/Resources/translations/ibexa_menu.en.xliff
@@ -6,6 +6,16 @@
       <note>The source node in most cases contains the sample message as written by the developer. If it looks like a dot-delimitted string such as "form.label.firstname", then the developer has not provided a default message.</note>
     </header>
     <body>
+      <trans-unit id="29149c1c0b3ca302aa3182e2547171c60b03d15c" resname="app_switcher.nav.label">
+        <source>App switcher</source>
+        <target state="new">App switcher</target>
+        <note>key: app_switcher.nav.label</note>
+      </trans-unit>
+      <trans-unit id="89566969891d56d87f41372602fde4fdf70e0088" resname="app_switcher.toggler.label">
+        <source>Open app switcher</source>
+        <target state="new">Open app switcher</target>
+        <note>key: app_switcher.toggler.label</note>
+      </trans-unit>
       <trans-unit id="a0e5e0f0d39b0d4d58cb089d09414a0b8bcf7e2e" resname="content__sidebar_right__copy">
         <source>Copy</source>
         <target state="new">Copy</target>
diff --git a/src/bundle/Resources/views/themes/admin/account/base.html.twig b/src/bundle/Resources/views/themes/admin/account/base.html.twig
index 0682ed0205..0768bc9fa2 100644
--- a/src/bundle/Resources/views/themes/admin/account/base.html.twig
+++ b/src/bundle/Resources/views/themes/admin/account/base.html.twig
@@ -12,46 +12,11 @@
     <body class="ibexa-login-view">
         <div class="ibexa-main-container">
             <div class="ibexa-login">
-                <div class="ibexa-login__sidebar" aria-hidden="true">
-                    <ul class="ibexa-login__sidebar-nav">
-                        <li>
-                            <a class="ibexa-login__sidebar-link" href="https://www.ibexa.co/" target="_blank" rel="noopener noreferrer">
-                                <img class="ibexa-login__sidebar-link-icon" src="{{ asset('bundles/ibexaadminui/img/brands/ibexa-icon.svg') }}" alt="ibexa" />
-                                <span class="ibexa-login__sidebar-link-text">Ibexa</span>
-                            </a>
-                        </li>
-                        <li>
-                            <a class="ibexa-login__sidebar-link" href="https://www.ibexa.co/orchestration/cohesivo" target="_blank" rel="noopener noreferrer">
-                                <img class="ibexa-login__sidebar-link-icon" src="{{ asset('bundles/ibexaadminui/img/brands/cohesivo-icon.svg') }}" alt="cohesivo" />
-                                <span class="ibexa-login__sidebar-link-text">Cohesivo</span>
-                            </a>
-                        </li>
-                        <li>
-                            <a class="ibexa-login__sidebar-link" href="https://www.actito.com/" target="_blank" rel="noopener noreferrer">
-                                <img class="ibexa-login__sidebar-link-icon" src="{{ asset('bundles/ibexaadminui/img/brands/actito-icon.svg') }}" alt="actito" />
-                                <span class="ibexa-login__sidebar-link-text">Actito</span>
-                            </a>
-                        </li>
-                        <li>
-                            <a class="ibexa-login__sidebar-link" href="https://qualifio.com/" target="_blank" rel="noopener noreferrer">
-                                <img class="ibexa-login__sidebar-link-icon" src="{{ asset('bundles/ibexaadminui/img/brands/qualifio-icon.svg') }}" alt="qualifio" />
-                                <span class="ibexa-login__sidebar-link-text">Qualifio</span>
-                            </a>
-                        </li>
-                        <li>
-                            <a class="ibexa-login__sidebar-link" href="https://www.quable.com/" target="_blank" rel="noopener noreferrer">
-                                <img class="ibexa-login__sidebar-link-icon" src="{{ asset('bundles/ibexaadminui/img/brands/quable-icon.svg') }}" alt="quable" />
-                                <span class="ibexa-login__sidebar-link-text">Quable</span>
-                            </a>
-                        </li>
-                        <li>
-                            <a class="ibexa-login__sidebar-link" href="https://www.raptorservices.com/" target="_blank" rel="noopener noreferrer">
-                                <img class="ibexa-login__sidebar-link-icon" src="{{ asset('bundles/ibexaadminui/img/brands/raptor-icon.svg') }}" alt="raptor" />
-                                <span class="ibexa-login__sidebar-link-text">Raptor</span>
-                            </a>
-                        </li>
-                    </ul>
-                </div>
+                {{ include('@ibexadesign/ui/component/app_switcher/app_switcher.html.twig', {
+                    modifier: 'login',
+                    active_app_name: 'Cohesivo',
+                    attr: { 'aria-hidden': 'true' },
+                }, with_context = false) }}
                 <div class="ibexa-login__panel">
                     <div class="ibexa-login__actions">
                         <img class="ibexa-login__logo" src="{{ asset('bundles/ibexaadminui/img/cohesivo-logo-alt.svg') }}" alt="ibexa" />
diff --git a/src/bundle/Resources/views/themes/admin/ui/component/app_switcher/app_switcher.html.twig b/src/bundle/Resources/views/themes/admin/ui/component/app_switcher/app_switcher.html.twig
new file mode 100644
index 0000000000..08ee1b2d74
--- /dev/null
+++ b/src/bundle/Resources/views/themes/admin/ui/component/app_switcher/app_switcher.html.twig
@@ -0,0 +1,42 @@
+{% trans_default_domain 'ibexa_menu' %}
+
+{% import '@ibexadesign/ui/component/macros.html.twig' as html %}
+
+{% set modifier = modifier|default('') %}
+{% set active_app_name = active_app_name|default(null) %}
+{% set active_app_href = active_app_href|default(null) %}
+{% set apps = apps|default([
+    { name: 'Ibexa', href: 'https://www.ibexa.co/', icon_path: asset('bundles/ibexaadminui/img/brands/ibexa-icon.svg') },
+    { name: 'Cohesivo', href: 'https://www.ibexa.co/orchestration/cohesivo', icon_path: asset('bundles/ibexaadminui/img/brands/cohesivo-icon.svg') },
+    { name: 'Actito', href: 'https://www.actito.com/', icon_path: asset('bundles/ibexaadminui/img/brands/actito-icon.svg') },
+    { name: 'Qualifio', href: 'https://qualifio.com/', icon_path: asset('bundles/ibexaadminui/img/brands/qualifio-icon.svg') },
+    { name: 'Quable', href: 'https://www.quable.com/', icon_path: asset('bundles/ibexaadminui/img/brands/quable-icon.svg') },
+    { name: 'Raptor', href: 'https://www.raptorservices.com/', icon_path: asset('bundles/ibexaadminui/img/brands/raptor-icon.svg') },
+]) %}
+
+<nav
+    class="ibexa-app-switcher {% if modifier %}ibexa-app-switcher--{{ modifier }}{% endif %}"
+    aria-label="{{ 'app_switcher.nav.label'|trans|desc('App switcher') }}"
+    {{ html.attributes(attr|default({})) }}
+>
+    {% block items %}
+        <ul class="ibexa-app-switcher__list">
+            {% for app in apps %}
+                {% set is_active = active_app_name is not null and app.name == active_app_name %}
+                <li class="ibexa-app-switcher__item">
+                    <a
+                        class="ibexa-app-switcher__link {% if is_active %}ibexa-app-switcher__link--active{% endif %}"
+                        href="{{ is_active and active_app_href ? active_app_href : app.href }}"
+                        {% if not is_active %}
+                            target="_blank"
+                            rel="noopener noreferrer"
+                        {% endif %}
+                    >
+                        <img class="ibexa-app-switcher__link-icon" src="{{ app.icon_path }}" alt="" />
+                        <span class="ibexa-app-switcher__link-text">{{ app.name }}</span>
+                    </a>
+                </li>
+            {% endfor %}
+        </ul>
+    {% endblock %}
+</nav>
diff --git a/src/bundle/Resources/views/themes/admin/ui/component/app_switcher/app_switcher_panel.html.twig b/src/bundle/Resources/views/themes/admin/ui/component/app_switcher/app_switcher_panel.html.twig
new file mode 100644
index 0000000000..865e1ba95b
--- /dev/null
+++ b/src/bundle/Resources/views/themes/admin/ui/component/app_switcher/app_switcher_panel.html.twig
@@ -0,0 +1,7 @@
+<aside id="ibexa-app-switcher-panel" class="ibexa-app-switcher-panel ibexa-app-switcher-panel--hidden">
+    {{ include('@ibexadesign/ui/component/app_switcher/app_switcher.html.twig', {
+        modifier: 'panel',
+        active_app_name: 'Cohesivo',
+        active_app_href: url('ibexa.dashboard'),
+    }, with_context = false) }}
+</aside>
diff --git a/src/bundle/Resources/views/themes/admin/ui/component/app_switcher/app_switcher_toggler.html.twig b/src/bundle/Resources/views/themes/admin/ui/component/app_switcher/app_switcher_toggler.html.twig
new file mode 100644
index 0000000000..20f4f11eac
--- /dev/null
+++ b/src/bundle/Resources/views/themes/admin/ui/component/app_switcher/app_switcher_toggler.html.twig
@@ -0,0 +1,14 @@
+{% trans_default_domain 'ibexa_menu' %}
+
+{% set toggler_label = 'app_switcher.toggler.label'|trans|desc('Open app switcher') %}
+
+<twig:ibexa:button
+    type="tertiary-alt"
+    size="medium"
+    class="ibexa-app-switcher-toggler"
+    icon="app-switcher"
+    aria-controls="ibexa-app-switcher-panel"
+    aria-expanded="false"
+    aria-label="{{ toggler_label }}"
+    title="{{ toggler_label }}"
+/>
diff --git a/src/bundle/Resources/views/themes/admin/ui/layout.html.twig b/src/bundle/Resources/views/themes/admin/ui/layout.html.twig
index 9c4dec8324..c4b6a5ff3d 100644
--- a/src/bundle/Resources/views/themes/admin/ui/layout.html.twig
+++ b/src/bundle/Resources/views/themes/admin/ui/layout.html.twig
@@ -122,6 +122,11 @@
 
         {% block header_row %}
             <header class="ibexa-main-header">
+                {% block app_switcher_toggler %}
+                    <div class="ibexa-main-header__app-switcher-column">
+                        {{ include('@ibexadesign/ui/component/app_switcher/app_switcher_toggler.html.twig') }}
+                    </div>
+                {% endblock %}
                 <div class="ibexa-main-header__brand-column">
                     {% block brand %}
                         <a class="ibexa-main-header__brand" href="{{ url('ibexa.dashboard') }}">
@@ -151,6 +156,9 @@
 
         {% block main_container %}
             <main class="ibexa-main-container {% block main_container_class %}{% endblock %}">
+                {% block app_switcher_panel %}
+                    {{ include('@ibexadesign/ui/component/app_switcher/app_switcher_panel.html.twig') }}
+                {% endblock %}
                 {% block side_column %}
                     <div class="ibexa-main-container__side-column {% block side_column_class %}{% endblock %}">
                         {% block left_sidebar %}