diff --git a/assets/icons/divider-collapsed-compact.svg b/assets/icons/divider-collapsed-compact.svg
new file mode 100644
index 00000000..1ca52623
--- /dev/null
+++ b/assets/icons/divider-collapsed-compact.svg
@@ -0,0 +1 @@
+<svg width="40" height="22" viewBox="0 0 40 22" fill="currentColor" xmlns="http://www.w3.org/2000/svg"><path d="M40 0v22c-.6-.8-5-4.6-12.6-6.4L9.3 11.9A11.4 11.4 0 0 1 0 0Z"/></svg>
diff --git a/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-Showcase-dark-chromium-linux.png b/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-Showcase-dark-chromium-linux.png
index a88ed329..e6f25731 100644
Binary files a/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-Showcase-dark-chromium-linux.png and b/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-Showcase-dark-chromium-linux.png differ
diff --git a/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-Showcase-dark-webkit-linux.png b/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-Showcase-dark-webkit-linux.png
index c491dc00..6fb81ff1 100644
Binary files a/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-Showcase-dark-webkit-linux.png and b/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-Showcase-dark-webkit-linux.png differ
diff --git a/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-Showcase-light-chromium-linux.png b/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-Showcase-light-chromium-linux.png
index c74ca6c9..11531ef9 100644
Binary files a/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-Showcase-light-chromium-linux.png and b/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-Showcase-light-chromium-linux.png differ
diff --git a/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-Showcase-light-webkit-linux.png b/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-Showcase-light-webkit-linux.png
index e0e6bdca..dafec946 100644
Binary files a/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-Showcase-light-webkit-linux.png and b/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-Showcase-light-webkit-linux.png differ
diff --git a/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-SingleSection-dark-chromium-linux.png b/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-SingleSection-dark-chromium-linux.png
index 02373f6a..65494330 100644
Binary files a/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-SingleSection-dark-chromium-linux.png and b/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-SingleSection-dark-chromium-linux.png differ
diff --git a/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-SingleSection-dark-webkit-linux.png b/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-SingleSection-dark-webkit-linux.png
index 4dabe558..6f2625ef 100644
Binary files a/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-SingleSection-dark-webkit-linux.png and b/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-SingleSection-dark-webkit-linux.png differ
diff --git a/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-SingleSection-light-chromium-linux.png b/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-SingleSection-light-chromium-linux.png
index f3c281b8..74c32d80 100644
Binary files a/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-SingleSection-light-chromium-linux.png and b/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-SingleSection-light-chromium-linux.png differ
diff --git a/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-SingleSection-light-webkit-linux.png b/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-SingleSection-light-webkit-linux.png
index 2fae8ce9..11f843e8 100644
Binary files a/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-SingleSection-light-webkit-linux.png and b/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-SingleSection-light-webkit-linux.png differ
diff --git a/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-StretchGroup-dark-chromium-linux.png b/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-StretchGroup-dark-chromium-linux.png
index 41a7821e..bc36c86b 100644
Binary files a/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-StretchGroup-dark-chromium-linux.png and b/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-StretchGroup-dark-chromium-linux.png differ
diff --git a/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-StretchGroup-dark-webkit-linux.png b/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-StretchGroup-dark-webkit-linux.png
index d85fc346..91dc4687 100644
Binary files a/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-StretchGroup-dark-webkit-linux.png and b/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-StretchGroup-dark-webkit-linux.png differ
diff --git a/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-StretchGroup-light-chromium-linux.png b/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-StretchGroup-light-chromium-linux.png
index c22a12a3..24102d0f 100644
Binary files a/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-StretchGroup-light-chromium-linux.png and b/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-StretchGroup-light-chromium-linux.png differ
diff --git a/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-StretchGroup-light-webkit-linux.png b/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-StretchGroup-light-webkit-linux.png
index 82a8b633..3df91f72 100644
Binary files a/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-StretchGroup-light-webkit-linux.png and b/src/components/ActionBar/__snapshots__/ActionBar.visual.test.tsx-snapshots/ActionBar-render-story-StretchGroup-light-webkit-linux.png differ
diff --git a/src/components/AsideHeader/AsideHeader.module.scss b/src/components/AsideHeader/AsideHeader.module.scss
index 390e5128..ea927b58 100644
--- a/src/components/AsideHeader/AsideHeader.module.scss
+++ b/src/components/AsideHeader/AsideHeader.module.scss
@@ -8,9 +8,13 @@ $block: '.#{variables.$ns}aside-header';
 
 #{$block} {
     $class: &;
-    --gn-aside-header-min-width: 56px;
+    --gn-aside-header-min-width: #{variables.$aside-header-min-width};
+
+    --_--item-height: #{variables.$item-height};
+    --_--item-margin-inline: #{variables.$item-margin-inline};
+    --gn-aside-header-item-expanded-radius: #{variables.$item-expanded-radius};
+    --gn-aside-header-header-divider-height: #{variables.$header-divider-height};
 
-    --_--item-icon-background-size: 36px;
     --_--background-color: var(--g-color-base-background);
     --_--decoration-collapsed-background-color: var(--g-color-base-warning-light);
     --_--decoration-expanded-background-color: var(--g-color-base-warning-light);
@@ -102,6 +106,15 @@ $block: '.#{variables.$ns}aside-header';
 
             z-index: -1;
         }
+
+        &_compact-mode {
+            --_--item-height: #{variables.$item-height-compact};
+            --_--item-margin-inline: #{variables.$item-margin-inline-compact};
+            --_--item-collapsed-radius: #{variables.$item-expanded-radius-compact};
+            --gn-aside-header-item-expanded-radius: #{variables.$item-expanded-radius-compact};
+            --gn-aside-header-header-divider-height: #{variables.$header-divider-height-compact};
+            --gn-aside-header-min-width: #{variables.$aside-header-min-width-compact};
+        }
     }
 
     &_collapsed &__aside {
@@ -142,15 +155,13 @@ $block: '.#{variables.$ns}aside-header';
     }
 
     &__header {
-        --gn-aside-header-header-divider-height: 29px;
-
         position: relative;
         z-index: 1;
         flex: none;
         box-sizing: border-box;
         width: calc(100%);
         padding-top: 8px;
-        padding-bottom: 22px;
+        padding-bottom: 25px;
         background-color: var(--gn-aside-top-decoration-background-color);
 
         #{$class}__header-divider {
@@ -222,7 +233,8 @@ $block: '.#{variables.$ns}aside-header';
         display: flex;
         align-items: center;
         justify-content: space-between;
-        margin-inline: 10px;
+        margin-inline: var(--_--item-margin-inline);
+        margin-bottom: 2px;
 
         &_without-logo {
             padding-bottom: var(--g-spacing-2);
@@ -232,11 +244,8 @@ $block: '.#{variables.$ns}aside-header';
     }
 
     &__logo-button &__logo-icon-place {
-        height: var(
-            --gn-aside-header-item-icon-background-size,
-            var(--_--item-icon-background-size)
-        );
-        width: var(--_--item-icon-background-size);
+        height: var(--_--item-height);
+        width: var(--_--item-height);
     }
 
     &__menu-items {
@@ -244,12 +253,12 @@ $block: '.#{variables.$ns}aside-header';
     }
 
     &__menu-item:not(:has([data-type='action'])) {
-        margin-inline: 10px;
+        margin-inline: var(--_--item-margin-inline);
     }
 
     &__footer {
         flex-shrink: 0;
-        margin: var(--g-spacing-2) 10px;
+        margin: var(--g-spacing-2) var(--_--item-margin-inline);
         display: flex;
         flex-direction: column;
         background-color: var(--gn-aside-bottom-background-color);
diff --git a/src/components/AsideHeader/AsideHeader.tsx b/src/components/AsideHeader/AsideHeader.tsx
index 220be93f..896a0a74 100644
--- a/src/components/AsideHeader/AsideHeader.tsx
+++ b/src/components/AsideHeader/AsideHeader.tsx
@@ -5,15 +5,16 @@ import {PageLayoutAside} from './components/PageLayout/PageLayoutAside';
 import {AsideHeaderProps} from './types';
 
 export const AsideHeader = React.forwardRef<HTMLDivElement, AsideHeaderProps>(
-    ({pinned, className, topAlert, ...props}, ref) => {
+    ({pinned, className, topAlert, isCompactMode, ...props}, ref) => {
         return (
             <PageLayout
                 pinned={pinned}
                 onChangePinned={props.onChangePinned}
                 className={className}
                 topAlert={topAlert}
+                isCompactMode={isCompactMode}
             >
-                <PageLayoutAside ref={ref} {...props} />
+                <PageLayoutAside ref={ref} {...props} isCompactMode={isCompactMode} />
                 <PageLayout.Content renderContent={props.renderContent} />
             </PageLayout>
         );
diff --git a/src/components/AsideHeader/README-ru.md b/src/components/AsideHeader/README-ru.md
index 859d76f5..34607105 100644
--- a/src/components/AsideHeader/README-ru.md
+++ b/src/components/AsideHeader/README-ru.md
@@ -173,6 +173,7 @@ export const Aside: FC = () => {
 | expandTitle               | Заголовок `CollapseButton` для разворачивания элемента навигации.                                               |                                                          `string`                                                          | `"Развернуть"` `"Expand"` |
 | headerDecoration          | Цвет фона верхнего блока с элементами логотипа и подзаголовка.                                                  |                                                         `boolean`                                                          |          `false`          |
 | hideCollapseButton        | Скрывает `CollapseButton`. Для установки дефолтного состояния элемента навигации используйте свойство `pinned`. |                                                         `boolean`                                                          |          `false`          |
+| isCompactMode             | При `true` элементы меню используют компактную высоту.                                                          |                                                         `boolean`                                                          |          `false`          |
 | logo                      | Контейнер логотипа, включающий иконку с заголовком и обрабатывающий клики.                                      |                                             [`Logo`](./../Logo/Readme.md#logo)                                             |                           |
 | menuItems                 | Элементы в среднем блоке навигации.                                                                             |                                                  `Array<AsideHeaderItem>`                                                  |           `[]`            |
 | menuMoreTitle             | Дополнительный заголовок для `menuItems`, если элементы не помещаются.                                          |                                                          `string`                                                          |     `"Ещё"` `"More"`      |
diff --git a/src/components/AsideHeader/README.md b/src/components/AsideHeader/README.md
index 5f9ecc11..50400025 100644
--- a/src/components/AsideHeader/README.md
+++ b/src/components/AsideHeader/README.md
@@ -174,6 +174,7 @@ export const Aside: FC = () => {
 | expandTitle               | `CollapseButton` title for expanding navigation                                      |                                                          `string`                                                          | `"Развернуть"` `"Expand"` |
 | headerDecoration          | Color background of the top section with logo and subheader items                    |                                                         `boolean`                                                          |          `false`          |
 | hideCollapseButton        | Hiding `CollapseButton`. Use `pinned` prop for setting default navigation state      |                                                         `boolean`                                                          |          `false`          |
+| isCompactMode             | When `true`, menu items use compact height                                           |                                                         `boolean`                                                          |          `false`          |
 | logo                      | Logo container includes icon, title, handling clicks                                 |              [`Logo`](https://github.com/gravity-ui/navigation/blob/main/src/components/Logo/Readme.md#logo)               |                           |
 | menuItems                 | Items in the navigation middle section                                               |                                                  `Array<AsideHeaderItem>`                                                  |           `[]`            |
 | menuMoreTitle             | Additional element title of menuItems if elements don't fit                          |                                                          `string`                                                          |     `"Ещё"` `"More"`      |
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-AdvancedUsage-dark-chromium-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-AdvancedUsage-dark-chromium-linux.png
index 82c1b1d5..66067470 100644
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-AdvancedUsage-dark-chromium-linux.png and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-AdvancedUsage-dark-chromium-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-AdvancedUsage-dark-webkit-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-AdvancedUsage-dark-webkit-linux.png
index 7819d913..b07e4a4d 100644
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-AdvancedUsage-dark-webkit-linux.png and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-AdvancedUsage-dark-webkit-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-AdvancedUsage-light-chromium-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-AdvancedUsage-light-chromium-linux.png
index d6a3f784..1966b9e5 100644
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-AdvancedUsage-light-chromium-linux.png and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-AdvancedUsage-light-chromium-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-AdvancedUsage-light-webkit-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-AdvancedUsage-light-webkit-linux.png
index c5841da5..80d2f4fd 100644
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-AdvancedUsage-light-webkit-linux.png and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-AdvancedUsage-light-webkit-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CollapsedNavigation-dark-chromium-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CollapsedNavigation-dark-chromium-linux.png
new file mode 100644
index 00000000..8e1ea531
Binary files /dev/null and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CollapsedNavigation-dark-chromium-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CollapsedNavigation-dark-webkit-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CollapsedNavigation-dark-webkit-linux.png
new file mode 100644
index 00000000..4238da25
Binary files /dev/null and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CollapsedNavigation-dark-webkit-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CollapsedNavigation-light-chromium-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CollapsedNavigation-light-chromium-linux.png
new file mode 100644
index 00000000..5d8597f8
Binary files /dev/null and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CollapsedNavigation-light-chromium-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CollapsedNavigation-light-webkit-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CollapsedNavigation-light-webkit-linux.png
new file mode 100644
index 00000000..6a417354
Binary files /dev/null and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CollapsedNavigation-light-webkit-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-Compact-dark-chromium-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-Compact-dark-chromium-linux.png
deleted file mode 100644
index b5e15995..00000000
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-Compact-dark-chromium-linux.png and /dev/null differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-Compact-dark-webkit-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-Compact-dark-webkit-linux.png
deleted file mode 100644
index 62e49021..00000000
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-Compact-dark-webkit-linux.png and /dev/null differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-Compact-light-chromium-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-Compact-light-chromium-linux.png
deleted file mode 100644
index e9d488a3..00000000
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-Compact-light-chromium-linux.png and /dev/null differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-Compact-light-webkit-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-Compact-light-webkit-linux.png
deleted file mode 100644
index daa148f0..00000000
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-Compact-light-webkit-linux.png and /dev/null differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CompactItemSizing-dark-chromium-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CompactItemSizing-dark-chromium-linux.png
new file mode 100644
index 00000000..f4d7de9a
Binary files /dev/null and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CompactItemSizing-dark-chromium-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CompactItemSizing-dark-webkit-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CompactItemSizing-dark-webkit-linux.png
new file mode 100644
index 00000000..faf2972a
Binary files /dev/null and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CompactItemSizing-dark-webkit-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CompactItemSizing-light-chromium-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CompactItemSizing-light-chromium-linux.png
new file mode 100644
index 00000000..22cb9c49
Binary files /dev/null and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CompactItemSizing-light-chromium-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CompactItemSizing-light-webkit-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CompactItemSizing-light-webkit-linux.png
new file mode 100644
index 00000000..feadcc24
Binary files /dev/null and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CompactItemSizing-light-webkit-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CustomBackground-dark-chromium-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CustomBackground-dark-chromium-linux.png
index ed4864b3..2724c412 100644
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CustomBackground-dark-chromium-linux.png and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CustomBackground-dark-chromium-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CustomBackground-dark-webkit-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CustomBackground-dark-webkit-linux.png
index a5814fff..c7f93118 100644
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CustomBackground-dark-webkit-linux.png and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CustomBackground-dark-webkit-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CustomBackground-light-chromium-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CustomBackground-light-chromium-linux.png
index 038f3a93..27db0fcb 100644
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CustomBackground-light-chromium-linux.png and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CustomBackground-light-chromium-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CustomBackground-light-webkit-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CustomBackground-light-webkit-linux.png
index 70ce3f43..9d9dfca3 100644
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CustomBackground-light-webkit-linux.png and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CustomBackground-light-webkit-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CustomTheme-dark-chromium-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CustomTheme-dark-chromium-linux.png
index b6dce75f..2e60e774 100644
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CustomTheme-dark-chromium-linux.png and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CustomTheme-dark-chromium-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CustomTheme-dark-webkit-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CustomTheme-dark-webkit-linux.png
index 73684c36..5f81256f 100644
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CustomTheme-dark-webkit-linux.png and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CustomTheme-dark-webkit-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CustomTheme-light-chromium-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CustomTheme-light-chromium-linux.png
index 0362f533..9c03d341 100644
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CustomTheme-light-chromium-linux.png and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CustomTheme-light-chromium-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CustomTheme-light-webkit-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CustomTheme-light-webkit-linux.png
index 1248c46d..689b2b12 100644
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CustomTheme-light-webkit-linux.png and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-CustomTheme-light-webkit-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-Fallback-dark-chromium-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-Fallback-dark-chromium-linux.png
index dc6a263c..098a3682 100644
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-Fallback-dark-chromium-linux.png and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-Fallback-dark-chromium-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-Fallback-dark-webkit-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-Fallback-dark-webkit-linux.png
index 03572e59..8ef775a6 100644
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-Fallback-dark-webkit-linux.png and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-Fallback-dark-webkit-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlert-dark-chromium-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlert-dark-chromium-linux.png
index 73a84818..9a699b91 100644
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlert-dark-chromium-linux.png and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlert-dark-chromium-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlert-dark-webkit-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlert-dark-webkit-linux.png
index 13b8d72d..7a700bc4 100644
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlert-dark-webkit-linux.png and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlert-dark-webkit-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlert-light-chromium-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlert-light-chromium-linux.png
index 3be3fa29..63a8559f 100644
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlert-light-chromium-linux.png and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlert-light-chromium-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlert-light-webkit-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlert-light-webkit-linux.png
index 4e0d8d48..1b7f4c58 100644
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlert-light-webkit-linux.png and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlert-light-webkit-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlertCentered-dark-chromium-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlertCentered-dark-chromium-linux.png
index d254984f..a1a702f4 100644
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlertCentered-dark-chromium-linux.png and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlertCentered-dark-chromium-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlertCentered-dark-webkit-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlertCentered-dark-webkit-linux.png
index f98dd3b7..c811e901 100644
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlertCentered-dark-webkit-linux.png and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlertCentered-dark-webkit-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlertCentered-light-chromium-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlertCentered-light-chromium-linux.png
index 0c2ddad6..a6559b99 100644
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlertCentered-light-chromium-linux.png and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlertCentered-light-chromium-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlertCentered-light-webkit-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlertCentered-light-webkit-linux.png
index 18c03290..c440822b 100644
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlertCentered-light-webkit-linux.png and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlertCentered-light-webkit-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlertCustom-dark-chromium-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlertCustom-dark-chromium-linux.png
index 56022b25..cce59fe3 100644
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlertCustom-dark-chromium-linux.png and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlertCustom-dark-chromium-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlertCustom-dark-webkit-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlertCustom-dark-webkit-linux.png
index 4f74515f..c85b2a89 100644
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlertCustom-dark-webkit-linux.png and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlertCustom-dark-webkit-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlertCustom-light-chromium-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlertCustom-light-chromium-linux.png
index 90d66452..36e3971b 100644
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlertCustom-light-chromium-linux.png and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlertCustom-light-chromium-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlertCustom-light-webkit-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlertCustom-light-webkit-linux.png
index 5b1ee0e8..21b95b95 100644
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlertCustom-light-webkit-linux.png and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-HeaderAlertCustom-light-webkit-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-LineClamp-dark-chromium-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-LineClamp-dark-chromium-linux.png
index 5115b572..6e4d31d5 100644
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-LineClamp-dark-chromium-linux.png and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-LineClamp-dark-chromium-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-LineClamp-dark-webkit-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-LineClamp-dark-webkit-linux.png
index 3e85ed7b..4ec24960 100644
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-LineClamp-dark-webkit-linux.png and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-LineClamp-dark-webkit-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-LineClamp-light-chromium-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-LineClamp-light-chromium-linux.png
index 0b11612d..acc2acd4 100644
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-LineClamp-light-chromium-linux.png and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-LineClamp-light-chromium-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-LineClamp-light-webkit-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-LineClamp-light-webkit-linux.png
index 12e554ab..dc10c757 100644
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-LineClamp-light-webkit-linux.png and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-LineClamp-light-webkit-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-MultipleTooltip-dark-chromium-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-MultipleTooltip-dark-chromium-linux.png
index b5e15995..8e1ea531 100644
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-MultipleTooltip-dark-chromium-linux.png and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-MultipleTooltip-dark-chromium-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-MultipleTooltip-dark-webkit-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-MultipleTooltip-dark-webkit-linux.png
index 62e49021..4238da25 100644
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-MultipleTooltip-dark-webkit-linux.png and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-MultipleTooltip-dark-webkit-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-MultipleTooltip-light-chromium-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-MultipleTooltip-light-chromium-linux.png
index e9d488a3..5d8597f8 100644
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-MultipleTooltip-light-chromium-linux.png and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-MultipleTooltip-light-chromium-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-MultipleTooltip-light-webkit-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-MultipleTooltip-light-webkit-linux.png
index daa148f0..6a417354 100644
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-MultipleTooltip-light-webkit-linux.png and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-MultipleTooltip-light-webkit-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-Showcase-dark-chromium-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-Showcase-dark-chromium-linux.png
index 22b1eb32..5be1c44c 100644
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-Showcase-dark-chromium-linux.png and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-Showcase-dark-chromium-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-Showcase-dark-webkit-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-Showcase-dark-webkit-linux.png
index d6997959..9bd6f671 100644
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-Showcase-dark-webkit-linux.png and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-Showcase-dark-webkit-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-Showcase-light-chromium-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-Showcase-light-chromium-linux.png
index 61179227..ce31e273 100644
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-Showcase-light-chromium-linux.png and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-Showcase-light-chromium-linux.png differ
diff --git a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-Showcase-light-webkit-linux.png b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-Showcase-light-webkit-linux.png
index 54621a47..34a9f106 100644
Binary files a/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-Showcase-light-webkit-linux.png and b/src/components/AsideHeader/__snapshots__/AsideHeader.visual.test.tsx-snapshots/AsideHeader-render-story-Showcase-light-webkit-linux.png differ
diff --git a/src/components/AsideHeader/__stories__/AsideHeader.stories.tsx b/src/components/AsideHeader/__stories__/AsideHeader.stories.tsx
index 9ebbfbe1..a3ba6dbe 100644
--- a/src/components/AsideHeader/__stories__/AsideHeader.stories.tsx
+++ b/src/components/AsideHeader/__stories__/AsideHeader.stories.tsx
@@ -51,9 +51,9 @@ export default {
 const ShowcaseTemplate: StoryFn = (args) => <AsideHeaderShowcase {...args} />;
 export const Showcase = ShowcaseTemplate.bind({});
 
-const CompactTemplate: StoryFn = (args) => <AsideHeaderShowcase {...args} />;
-export const Compact = CompactTemplate.bind({});
-Compact.args = {
+const CollapsedNavigationTemplate: StoryFn = (args) => <AsideHeaderShowcase {...args} />;
+export const CollapsedNavigation = CollapsedNavigationTemplate.bind({});
+CollapsedNavigation.args = {
     initialPinned: false,
     hideCollapseButton: true,
 };
@@ -334,7 +334,7 @@ const GroupedMenuCollapsibleTemplate: StoryFn = (args) => {
     const [currentMenuGroups, setCurrentMenuGroups] = React.useState(menuGroupsWithIcons);
 
     return (
-        <PageLayout pinned={pinned} onChangePinned={setPinned}>
+        <PageLayout pinned={pinned} onChangePinned={setPinned} isCompactMode={args.isCompactMode}>
             <PageLayoutAside
                 headerDecoration
                 logo={DEFAULT_LOGO}
@@ -372,6 +372,11 @@ GroupedMenuCollapsible.args = {
     initialPinned: true,
 };
 
+export const CompactItemSizing = GroupedMenuCollapsibleTemplate.bind({});
+CompactItemSizing.args = {
+    isCompactMode: true,
+};
+
 const CustomThemesWithNewColorsTemplate: StoryFn = (args) => {
     return (
         <>
diff --git a/src/components/AsideHeader/__stories__/AsideHeaderShowcase.tsx b/src/components/AsideHeader/__stories__/AsideHeaderShowcase.tsx
index a7afe3df..4fe8204f 100644
--- a/src/components/AsideHeader/__stories__/AsideHeaderShowcase.tsx
+++ b/src/components/AsideHeader/__stories__/AsideHeaderShowcase.tsx
@@ -43,6 +43,7 @@ export interface AsideHeaderShowcaseProps {
     customBackgroundClassName?: string;
     headerDecoration?: boolean;
     hideCollapseButton?: boolean;
+    isCompactMode?: boolean;
     externalMenuItems?: AsideHeaderProps['menuItems'];
     externalMenuGroups?: AsideHeaderProps['menuGroups'];
 }
@@ -55,6 +56,7 @@ export const AsideHeaderShowcase: React.FC<React.PropsWithChildren<AsideHeaderSh
     customBackgroundClassName,
     headerDecoration,
     hideCollapseButton,
+    isCompactMode,
     externalMenuItems,
     externalMenuGroups,
     children,
@@ -154,6 +156,7 @@ export const AsideHeaderShowcase: React.FC<React.PropsWithChildren<AsideHeaderSh
                 ]}
                 pinned={pinned}
                 hideCollapseButton={hideCollapseButton}
+                isCompactMode={isCompactMode}
                 multipleTooltip={multipleTooltip}
                 openModalSubscriber={openModalSubscriber}
                 topAlert={topAlert}
diff --git a/src/components/AsideHeader/__stories__/getAsideHeaderWrapper.tsx b/src/components/AsideHeader/__stories__/getAsideHeaderWrapper.tsx
index f118dc86..5c732400 100644
--- a/src/components/AsideHeader/__stories__/getAsideHeaderWrapper.tsx
+++ b/src/components/AsideHeader/__stories__/getAsideHeaderWrapper.tsx
@@ -22,7 +22,7 @@ export function getAsideHeaderWrapper(
     props: AsideHeaderProps = {
         logo: {
             icon: logoIcon,
-            iconSize: 24,
+            iconSize: 32,
             text: 'My Service',
             'aria-label': 'My Service',
         },
diff --git a/src/components/AsideHeader/__tests__/AsideHeader.visual.test.tsx b/src/components/AsideHeader/__tests__/AsideHeader.visual.test.tsx
index 98b40dfe..7104abfb 100644
--- a/src/components/AsideHeader/__tests__/AsideHeader.visual.test.tsx
+++ b/src/components/AsideHeader/__tests__/AsideHeader.visual.test.tsx
@@ -14,8 +14,17 @@ test.describe('AsideHeader', () => {
         await expectScreenshot();
     });
 
-    test('render story: <Compact>', async ({mount, expectScreenshot}) => {
-        await mount(<AsideHeaderStories.Compact />, undefined, {
+    test('render story: <CollapsedNavigation>', async ({mount, expectScreenshot}) => {
+        await mount(<AsideHeaderStories.CollapsedNavigation />, undefined, {
+            width: 1200,
+            height: 720,
+        });
+
+        await expectScreenshot();
+    });
+
+    test('render story: <CompactItemSizing>', async ({mount, expectScreenshot}) => {
+        await mount(<AsideHeaderStories.CompactItemSizing />, undefined, {
             width: 1200,
             height: 720,
         });
diff --git a/src/components/AsideHeader/components/AllPagesPanel/AllPagesPanel.module.scss b/src/components/AsideHeader/components/AllPagesPanel/AllPagesPanel.module.scss
index 125dbe0c..6ddfe8d0 100644
--- a/src/components/AsideHeader/components/AllPagesPanel/AllPagesPanel.module.scss
+++ b/src/components/AsideHeader/components/AllPagesPanel/AllPagesPanel.module.scss
@@ -5,24 +5,11 @@
     height: 100%;
     padding: var(--g-spacing-4) var(--g-spacing-6);
     box-sizing: border-box;
-    --gn-aside-header-item-expanded-radius: 6px;
+    --gn-aside-header-item-expanded-radius: #{variables.$item-expanded-radius};
+    --_--item-height: #{variables.$item-height};
 
     &__content {
         overflow: auto;
         flex: 1;
     }
-
-    &__discoverable-feature-wrapper {
-        display: flex;
-    }
-
-    &__menu-group {
-        width: 100%;
-        margin-inline: 10px;
-
-        &:not(:last-child) {
-            padding-bottom: var(--g-spacing-2);
-            border-bottom: 1px solid var(--g-color-line-generic);
-        }
-    }
 }
diff --git a/src/components/AsideHeader/components/CollapseButton/CollapseButton.tsx b/src/components/AsideHeader/components/CollapseButton/CollapseButton.tsx
index 1e2c5419..9492ff1b 100644
--- a/src/components/AsideHeader/components/CollapseButton/CollapseButton.tsx
+++ b/src/components/AsideHeader/components/CollapseButton/CollapseButton.tsx
@@ -13,9 +13,10 @@ const b = createBlock('collapse-button', styles);
 
 interface CollapseButtonProps {
     className?: string;
+    isCompactMode?: boolean;
 }
 
-export const CollapseButton = ({className}: CollapseButtonProps) => {
+export const CollapseButton = ({className, isCompactMode}: CollapseButtonProps) => {
     const {pinned, onChangePinned} = useAsideHeaderContext();
     const {expandTitle, collapseTitle, collapseButtonWrapper} = useAsideHeaderInnerContext();
 
@@ -32,7 +33,7 @@ export const CollapseButton = ({className}: CollapseButtonProps) => {
     const defaultButton = (
         <Button
             view="flat-secondary"
-            size="l"
+            size={isCompactMode ? 'm' : 'l'}
             className={b({collapsed: !pinned}, className)}
             onClick={onCollapseButtonClick}
             aria-label={buttonTitle}
diff --git a/src/components/AsideHeader/components/CompositeBar/CompositeBar.module.scss b/src/components/AsideHeader/components/CompositeBar/CompositeBar.module.scss
index 973f50a4..82b36c5f 100644
--- a/src/components/AsideHeader/components/CompositeBar/CompositeBar.module.scss
+++ b/src/components/AsideHeader/components/CompositeBar/CompositeBar.module.scss
@@ -5,8 +5,6 @@ $block: '.#{variables.$ns}composite-bar';
 #{$block} {
     $class: &;
 
-    --gn-aside-header-item-expanded-radius: 6px;
-
     flex: 1 1 auto;
     width: 100%;
     min-height: 40px;
@@ -85,9 +83,8 @@ $block: '.#{variables.$ns}composite-bar';
         }
     }
 
-    &__menu-group-header,
-    &__menu-group-item {
-        height: 36px;
+    &__menu-group-header {
+        height: var(--_--item-height);
     }
 
     &__menu-group-item {
@@ -145,6 +142,6 @@ $block: '.#{variables.$ns}composite-bar';
     }
 
     &__menu-item[data-type='action'] {
-        margin-inline: 10px;
+        margin-inline: var(--_--item-margin-inline);
     }
 }
diff --git a/src/components/AsideHeader/components/CompositeBar/CompositeBar.tsx b/src/components/AsideHeader/components/CompositeBar/CompositeBar.tsx
index 7e92bf0d..6a74de11 100644
--- a/src/components/AsideHeader/components/CompositeBar/CompositeBar.tsx
+++ b/src/components/AsideHeader/components/CompositeBar/CompositeBar.tsx
@@ -3,8 +3,8 @@ import React, {FC, ReactNode, useCallback, useContext, useRef, useState} from 'r
 import {ChevronRight} from '@gravity-ui/icons';
 import {List, ListSortParams} from '@gravity-ui/uikit';
 
-import {ASIDE_HEADER_COMPACT_WIDTH} from '../../../constants';
 import {createBlock} from '../../../utils/cn';
+import {getCollapsedWidth} from '../../../utils/getCollapsedWidth';
 import {AsideHeaderItem, MenuItemsWithGroups} from '../../types';
 import {UNGROUPED_ID} from '../AllPagesPanel/constants';
 
@@ -36,6 +36,8 @@ type CompositeBarProps = {
     menuItemClassName?: string;
     editMode?: boolean;
     onToggleGroupCollapsed?: (groupId: string) => void;
+    /** When `true`, menu items use compact height. */
+    isCompactMode?: boolean;
 };
 
 type CompositeBarViewProps = CompositeBarProps & {
@@ -51,6 +53,8 @@ type CompositeBarViewProps = CompositeBarProps & {
     onSecondLevelSortEnd?: (
         groupIndex: number,
     ) => (params: {oldIndex: number; newIndex: number}) => void;
+    /** When `true`, menu items use compact height. */
+    isCompactMode?: boolean;
 };
 
 export const CompositeBarView: FC<CompositeBarViewProps> = ({
@@ -70,6 +74,7 @@ export const CompositeBarView: FC<CompositeBarViewProps> = ({
     onToggleMenuItemVisibility,
     onFirstLevelSortEnd,
     onSecondLevelSortEnd,
+    isCompactMode,
 }) => {
     const ref = useRef<List<AsideHeaderItem>>(null);
     const tooltipRef = useRef<HTMLDivElement>(null);
@@ -96,6 +101,8 @@ export const CompositeBarView: FC<CompositeBarViewProps> = ({
         };
     }, [multipleTooltip, multipleTooltipActive, setMultipleTooltipContextValue]);
 
+    const collapsedWidth = getCollapsedWidth(isCompactMode);
+
     const onTooltipMouseEnter = useCallback(
         (e: {clientX: number}) => {
             if (
@@ -104,7 +111,7 @@ export const CompositeBarView: FC<CompositeBarViewProps> = ({
                 !multipleTooltipActive &&
                 document.hasFocus() &&
                 activeIndex !== lastClickedItemIndex &&
-                e.clientX <= ASIDE_HEADER_COMPACT_WIDTH
+                e.clientX <= collapsedWidth
             ) {
                 setMultipleTooltipContextValue?.({
                     active: true,
@@ -117,6 +124,7 @@ export const CompositeBarView: FC<CompositeBarViewProps> = ({
             multipleTooltipActive,
             activeIndex,
             lastClickedItemIndex,
+            collapsedWidth,
             setMultipleTooltipContextValue,
         ],
     );
@@ -250,8 +258,8 @@ export const CompositeBarView: FC<CompositeBarViewProps> = ({
                     ref={ref}
                     items={items}
                     selectedItemIndex={type === 'menu' ? getSelectedItemIndex(items) : undefined}
-                    itemHeight={getItemHeight}
-                    itemsHeight={getItemsHeight}
+                    itemHeight={(item) => getItemHeight(item, isCompactMode)}
+                    itemsHeight={(items) => getItemsHeight(items, isCompactMode)}
                     itemClassName={b('root-menu-item', {collapsed: !isExpanded}, menuItemClassName)}
                     virtualized={false}
                     filterable={false}
@@ -339,8 +347,10 @@ export const CompositeBarView: FC<CompositeBarViewProps> = ({
                                             edit: enableSorting,
                                             collapsed: !isExpanded,
                                         })}
-                                        itemHeight={getItemHeight}
-                                        itemsHeight={getItemsHeight}
+                                        itemHeight={(item) => getItemHeight(item, isCompactMode)}
+                                        itemsHeight={(items) =>
+                                            getItemsHeight(items, isCompactMode)
+                                        }
                                         renderItem={(
                                             nestedItem,
                                             _isNestedItemActive,
@@ -404,6 +414,7 @@ export const CompositeBar: FC<CompositeBarProps> = ({
     className,
     menuItemClassName,
     editMode = false,
+    isCompactMode,
 }) => {
     const visibleItems = items
         ?.filter((item) => !item.hidden)
@@ -432,6 +443,7 @@ export const CompositeBar: FC<CompositeBarProps> = ({
                     multipleTooltip={multipleTooltip}
                     onToggleGroupCollapsed={onToggleGroupCollapsed}
                     editMode={editMode}
+                    isCompactMode={isCompactMode}
                 />
             </div>
         );
@@ -445,6 +457,7 @@ export const CompositeBar: FC<CompositeBarProps> = ({
                     items={visibleItems}
                     onItemClick={onItemClick}
                     editMode={editMode}
+                    isCompactMode={isCompactMode}
                 />
             </div>
         );
diff --git a/src/components/AsideHeader/components/CompositeBar/HighlightedItem/HighlightedItem.module.scss b/src/components/AsideHeader/components/CompositeBar/HighlightedItem/HighlightedItem.module.scss
index 60b1f0bb..6372dc0f 100644
--- a/src/components/AsideHeader/components/CompositeBar/HighlightedItem/HighlightedItem.module.scss
+++ b/src/components/AsideHeader/components/CompositeBar/HighlightedItem/HighlightedItem.module.scss
@@ -4,7 +4,6 @@ $block: '.#{variables.$ns}composite-bar-highlighted-item';
 
 #{$block} {
     --_--background-color: var(--g-color-base-background);
-    --_--item-icon-background-size: 38px;
     --_--item-background-color-hover: var(--g-color-base-selection-hover);
     --_--item-selected-background-color-active: var(--g-color-base-selection);
 
@@ -14,14 +13,8 @@ $block: '.#{variables.$ns}composite-bar-highlighted-item';
     justify-content: center;
 
     &__icon {
-        width: var(
-            --gn-aside-header-item-icon-background-size,
-            var(--_--item-icon-background-size)
-        );
-        height: var(
-            --gn-aside-header-item-icon-background-size,
-            var(--_--item-icon-background-size)
-        );
+        width: var(--_--item-height);
+        height: var(--_--item-height);
         border-radius: 7px;
         cursor: pointer;
         background-color: var(--gn-aside-header-background-color, var(--_--background-color));
diff --git a/src/components/AsideHeader/components/CompositeBar/Item/Item.module.scss b/src/components/AsideHeader/components/CompositeBar/Item/Item.module.scss
index 400d5b7c..36748710 100644
--- a/src/components/AsideHeader/components/CompositeBar/Item/Item.module.scss
+++ b/src/components/AsideHeader/components/CompositeBar/Item/Item.module.scss
@@ -3,14 +3,11 @@
 
 $block: '.#{variables.$ns}composite-bar-item';
 
-$actionLeftRightMargin: 10px;
-
 #{$block} {
     @include mixins.accessibility-button;
 
     $class: &;
-    --gn-composite-bar-item-action-size: 36px;
-    --_--item-icon-background-size: 36px;
+    --gn-composite-bar-item-action-size: var(--_--item-height);
 
     --_--horizontal-divider-line-color: var(--g-color-line-generic);
 
@@ -109,16 +106,10 @@ $actionLeftRightMargin: 10px;
             top: 50%;
             left: 50%;
             z-index: -1;
-            width: var(
-                --gn-aside-header-item-icon-background-size,
-                var(--_--item-icon-background-size)
-            );
-            height: var(
-                --gn-aside-header-item-icon-background-size,
-                var(--_--item-icon-background-size)
-            );
-            margin-top: -18px;
-            margin-left: -18px;
+            width: var(--_--item-height);
+            height: var(--_--item-height);
+            margin-top: calc(var(--_--item-height) / -2);
+            margin-left: calc(var(--_--item-height) / -2);
             border-radius: var(
                 --gn-aside-header-item-collapsed-radius,
                 var(--_--item-collapsed-radius)
@@ -157,7 +148,7 @@ $actionLeftRightMargin: 10px;
 
     &__icon-place {
         flex-shrink: 0;
-        width: var(--_--item-icon-background-size, 36px);
+        width: var(--_--item-height);
         display: flex;
         align-items: center;
         justify-content: center;
@@ -248,6 +239,8 @@ $actionLeftRightMargin: 10px;
         -webkit-line-clamp: 2;
         overflow: hidden;
         text-align: start;
+        font-size: var(--g-text-body-short-font-size);
+        line-height: var(--g-text-body-short-line-height);
 
         color: var(--gn-aside-header-item-text-color, var(--_--item-text-color));
 
@@ -374,7 +367,7 @@ $actionLeftRightMargin: 10px;
         }
 
         &:global(.#{variables.$ns}footer-item) {
-            width: calc(100% - 2 * $actionLeftRightMargin);
+            width: calc(100% - 2 * var(--_--item-margin-inline));
         }
     }
 
diff --git a/src/components/AsideHeader/components/CompositeBar/utils.ts b/src/components/AsideHeader/components/CompositeBar/utils.ts
index b4d3189f..7493ac2b 100644
--- a/src/components/AsideHeader/components/CompositeBar/utils.ts
+++ b/src/components/AsideHeader/components/CompositeBar/utils.ts
@@ -1,16 +1,16 @@
-import {ITEM_HEIGHT} from '../../../constants';
+import {ITEM_GAP, ITEM_HEIGHT, ITEM_HEIGHT_COMPACT} from '../../../constants';
 import {AsideHeaderItem, GroupedMenuItem, MenuItemsWithGroups} from '../../types';
 import {getGroupBlockHeight} from '../../utils/getGroupHeight';
 
-function getGroupHeight(compositeItem: GroupedMenuItem) {
+function getGroupHeight(compositeItem: GroupedMenuItem, isCompactMode?: boolean) {
     const visibleGroupItems = compositeItem.isCollapsed ? [] : compositeItem.items;
 
-    return getGroupBlockHeight(visibleGroupItems);
+    return getGroupBlockHeight(visibleGroupItems, isCompactMode);
 }
 
-export function getItemHeight(compositeItem: MenuItemsWithGroups) {
+export function getItemHeight(compositeItem: MenuItemsWithGroups, isCompactMode?: boolean) {
     if ('items' in compositeItem && compositeItem.items && compositeItem.items?.length > 0) {
-        return getGroupHeight(compositeItem);
+        return getGroupHeight(compositeItem, isCompactMode);
     }
 
     switch (compositeItem.type) {
@@ -20,12 +20,14 @@ export function getItemHeight(compositeItem: MenuItemsWithGroups) {
             return 15;
 
         default:
-            return ITEM_HEIGHT;
+            return isCompactMode ? ITEM_HEIGHT_COMPACT : ITEM_HEIGHT;
     }
 }
 
-export function getItemsHeight<T extends AsideHeaderItem>(items: T[]) {
-    return items.reduce((sum, item) => sum + getItemHeight(item), 0);
+export function getItemsHeight<T extends AsideHeaderItem>(items: T[], isCompactMode?: boolean) {
+    const gaps = items.length > 1 ? (items.length - 1) * ITEM_GAP : 0;
+
+    return items.reduce((sum, item) => sum + getItemHeight(item, isCompactMode), 0) + gaps;
 }
 
 export function getSelectedItemIndex(compositeItems: AsideHeaderItem[]) {
diff --git a/src/components/AsideHeader/components/FirstPanel.tsx b/src/components/AsideHeader/components/FirstPanel.tsx
index eec10735..86ef7722 100644
--- a/src/components/AsideHeader/components/FirstPanel.tsx
+++ b/src/components/AsideHeader/components/FirstPanel.tsx
@@ -41,6 +41,7 @@ export const FirstPanel = React.forwardRef<HTMLDivElement>((_props, ref) => {
         onExpand,
         onFold,
         isExpanded,
+        isCompactMode,
     } = useAsideHeaderInnerContext();
 
     const flatListItems = useGroupedMenuItems(menuItems, menuGroups);
@@ -61,7 +62,7 @@ export const FirstPanel = React.forwardRef<HTMLDivElement>((_props, ref) => {
                 classNames={asideTransitionClassNames}
             >
                 <div
-                    className={b('aside', className)}
+                    className={b('aside', {['compact-mode']: isCompactMode}, className)}
                     style={{width: size}}
                     data-qa={qa}
                     onMouseEnter={onExpand}
@@ -89,6 +90,7 @@ export const FirstPanel = React.forwardRef<HTMLDivElement>((_props, ref) => {
                                 onMoreClick={onMenuMoreClick}
                                 onToggleGroupCollapsed={onToggleGroupCollapsed}
                                 multipleTooltip={multipleTooltip}
+                                isCompactMode={isCompactMode}
                             />
                         ) : (
                             <div className={b('menu-items')} />
@@ -99,6 +101,7 @@ export const FirstPanel = React.forwardRef<HTMLDivElement>((_props, ref) => {
                                 size,
                                 isExpanded,
                                 asideRef,
+                                isCompactMode,
                             })}
                         </div>
                     </div>
diff --git a/src/components/AsideHeader/components/FooterItem/FooterItem.module.scss b/src/components/AsideHeader/components/FooterItem/FooterItem.module.scss
index 2d6b3038..a56c49d1 100644
--- a/src/components/AsideHeader/components/FooterItem/FooterItem.module.scss
+++ b/src/components/AsideHeader/components/FooterItem/FooterItem.module.scss
@@ -7,7 +7,7 @@ $block: '.#{variables.$ns}footer-item';
     $class: &;
 
     width: 100%;
-    height: 36px;
+    height: var(--_--item-height);
 
     border-radius: var(--gn-aside-header-item-expanded-radius);
     margin-bottom: 2px;
diff --git a/src/components/AsideHeader/components/FooterItem/__snapshots__/FooterItem.visual.test.tsx-snapshots/FooterItem-render-story-Default-dark-chromium-linux.png b/src/components/AsideHeader/components/FooterItem/__snapshots__/FooterItem.visual.test.tsx-snapshots/FooterItem-render-story-Default-dark-chromium-linux.png
index c6595094..6bf759f2 100644
Binary files a/src/components/AsideHeader/components/FooterItem/__snapshots__/FooterItem.visual.test.tsx-snapshots/FooterItem-render-story-Default-dark-chromium-linux.png and b/src/components/AsideHeader/components/FooterItem/__snapshots__/FooterItem.visual.test.tsx-snapshots/FooterItem-render-story-Default-dark-chromium-linux.png differ
diff --git a/src/components/AsideHeader/components/FooterItem/__snapshots__/FooterItem.visual.test.tsx-snapshots/FooterItem-render-story-Default-dark-webkit-linux.png b/src/components/AsideHeader/components/FooterItem/__snapshots__/FooterItem.visual.test.tsx-snapshots/FooterItem-render-story-Default-dark-webkit-linux.png
index acce308b..6b298f80 100644
Binary files a/src/components/AsideHeader/components/FooterItem/__snapshots__/FooterItem.visual.test.tsx-snapshots/FooterItem-render-story-Default-dark-webkit-linux.png and b/src/components/AsideHeader/components/FooterItem/__snapshots__/FooterItem.visual.test.tsx-snapshots/FooterItem-render-story-Default-dark-webkit-linux.png differ
diff --git a/src/components/AsideHeader/components/FooterItem/__snapshots__/FooterItem.visual.test.tsx-snapshots/FooterItem-render-story-Default-light-chromium-linux.png b/src/components/AsideHeader/components/FooterItem/__snapshots__/FooterItem.visual.test.tsx-snapshots/FooterItem-render-story-Default-light-chromium-linux.png
index 6ac3768e..d36a190b 100644
Binary files a/src/components/AsideHeader/components/FooterItem/__snapshots__/FooterItem.visual.test.tsx-snapshots/FooterItem-render-story-Default-light-chromium-linux.png and b/src/components/AsideHeader/components/FooterItem/__snapshots__/FooterItem.visual.test.tsx-snapshots/FooterItem-render-story-Default-light-chromium-linux.png differ
diff --git a/src/components/AsideHeader/components/FooterItem/__snapshots__/FooterItem.visual.test.tsx-snapshots/FooterItem-render-story-Default-light-webkit-linux.png b/src/components/AsideHeader/components/FooterItem/__snapshots__/FooterItem.visual.test.tsx-snapshots/FooterItem-render-story-Default-light-webkit-linux.png
index ab191806..ad39e716 100644
Binary files a/src/components/AsideHeader/components/FooterItem/__snapshots__/FooterItem.visual.test.tsx-snapshots/FooterItem-render-story-Default-light-webkit-linux.png and b/src/components/AsideHeader/components/FooterItem/__snapshots__/FooterItem.visual.test.tsx-snapshots/FooterItem-render-story-Default-light-webkit-linux.png differ
diff --git a/src/components/AsideHeader/components/FooterItem/__stories__/FooterItem.stories.tsx b/src/components/AsideHeader/components/FooterItem/__stories__/FooterItem.stories.tsx
index 848de42c..20c8058b 100644
--- a/src/components/AsideHeader/components/FooterItem/__stories__/FooterItem.stories.tsx
+++ b/src/components/AsideHeader/components/FooterItem/__stories__/FooterItem.stories.tsx
@@ -3,7 +3,7 @@ import React from 'react';
 import {Gear} from '@gravity-ui/icons';
 import type {Meta, StoryFn} from '@storybook/react';
 
-import {ASIDE_HEADER_COMPACT_WIDTH, ASIDE_HEADER_EXPANDED_WIDTH} from '../../../../constants';
+import {ASIDE_HEADER_COLLAPSED_WIDTH, ASIDE_HEADER_EXPANDED_WIDTH} from '../../../../constants';
 import {AsideHeaderContextProvider} from '../../../AsideHeaderContext';
 import {EMPTY_CONTEXT_VALUE} from '../../../__stories__/moc';
 import {FooterItem, FooterItemProps} from '../FooterItem';
@@ -18,7 +18,7 @@ export default {
             const {
                 args: {isExpanded},
             } = context;
-            const width = isExpanded ? ASIDE_HEADER_EXPANDED_WIDTH : ASIDE_HEADER_COMPACT_WIDTH;
+            const width = isExpanded ? ASIDE_HEADER_EXPANDED_WIDTH : ASIDE_HEADER_COLLAPSED_WIDTH;
 
             return (
                 <div style={{width}} className="footer-item-showcase">
diff --git a/src/components/AsideHeader/components/Header.tsx b/src/components/AsideHeader/components/Header.tsx
index ec03a99b..bf634353 100644
--- a/src/components/AsideHeader/components/Header.tsx
+++ b/src/components/AsideHeader/components/Header.tsx
@@ -3,7 +3,8 @@ import React, {useCallback} from 'react';
 import {Icon} from '@gravity-ui/uikit';
 
 import {Logo} from '../../Logo';
-import {ASIDE_HEADER_COMPACT_WIDTH, HEADER_DIVIDER_HEIGHT} from '../../constants';
+import {HEADER_DIVIDER_HEIGHT, HEADER_DIVIDER_HEIGHT_COMPACT} from '../../constants';
+import {getCollapsedWidth} from '../../utils/getCollapsedWidth';
 import {useAsideHeaderInnerContext} from '../AsideHeaderContext';
 import {AsideHeaderItem} from '../types';
 import {b} from '../utils';
@@ -12,6 +13,7 @@ import {useGroupedMenuItems} from './AllPagesPanel/useGroupedMenuItems';
 import {CollapseButton} from './CollapseButton/CollapseButton';
 import {CompositeBar} from './CompositeBar';
 
+import headerDividerCollapsedCompactIcon from '../../../../assets/icons/divider-collapsed-compact.svg';
 import headerDividerCollapsedIcon from '../../../../assets/icons/divider-collapsed.svg';
 
 const DEFAULT_SUBHEADER_ITEMS: AsideHeaderItem[] = [];
@@ -26,6 +28,7 @@ export const Header = () => {
         headerDecoration,
         subheaderItems,
         hideCollapseButton,
+        isCompactMode,
     } = useAsideHeaderInnerContext();
 
     const items = useGroupedMenuItems(subheaderItems || DEFAULT_SUBHEADER_ITEMS);
@@ -44,6 +47,7 @@ export const Header = () => {
                 {logo && (
                     <Logo
                         {...logo}
+                        isCompactMode={isCompactMode}
                         onClick={onLogoClick}
                         isExpanded={isExpanded}
                         buttonClassName={b('logo-button')}
@@ -52,7 +56,10 @@ export const Header = () => {
                 )}
 
                 {!hideCollapseButton && (
-                    <CollapseButton className={b('pin-button', {collapsed: !isExpanded})} />
+                    <CollapseButton
+                        className={b('pin-button', {collapsed: !isExpanded})}
+                        isCompactMode={isCompactMode}
+                    />
                 )}
             </div>
 
@@ -63,14 +70,19 @@ export const Header = () => {
                 isExpanded={isExpanded}
                 items={items}
                 onItemClick={onItemClick}
+                isCompactMode={isCompactMode}
             />
 
             {headerDecoration && (
                 <Icon
-                    data={headerDividerCollapsedIcon}
+                    data={
+                        isCompactMode
+                            ? headerDividerCollapsedCompactIcon
+                            : headerDividerCollapsedIcon
+                    }
                     className={b('header-divider')}
-                    width={ASIDE_HEADER_COMPACT_WIDTH}
-                    height={HEADER_DIVIDER_HEIGHT}
+                    width={getCollapsedWidth(isCompactMode)}
+                    height={isCompactMode ? HEADER_DIVIDER_HEIGHT_COMPACT : HEADER_DIVIDER_HEIGHT}
                 />
             )}
         </div>
diff --git a/src/components/AsideHeader/components/PageLayout/AsideFallback.tsx b/src/components/AsideHeader/components/PageLayout/AsideFallback.tsx
index 9b39fa84..12530401 100644
--- a/src/components/AsideHeader/components/PageLayout/AsideFallback.tsx
+++ b/src/components/AsideHeader/components/PageLayout/AsideFallback.tsx
@@ -2,7 +2,7 @@ import React from 'react';
 
 import {Icon, QAProps} from '@gravity-ui/uikit';
 
-import {ASIDE_HEADER_COMPACT_WIDTH, HEADER_DIVIDER_HEIGHT, ITEM_HEIGHT} from '../../../constants';
+import {ASIDE_HEADER_COLLAPSED_WIDTH, HEADER_DIVIDER_HEIGHT, ITEM_HEIGHT} from '../../../constants';
 import {useAsideHeaderContext} from '../../AsideHeaderContext';
 import {b} from '../../utils';
 
@@ -29,7 +29,7 @@ export const AsideFallback: React.FC<Props> = ({headerDecoration, subheaderItems
                         <Icon
                             data={headerDividerCollapsedIcon}
                             className={b('header-divider')}
-                            width={ASIDE_HEADER_COMPACT_WIDTH}
+                            width={ASIDE_HEADER_COLLAPSED_WIDTH}
                             height={HEADER_DIVIDER_HEIGHT}
                         />
                     ) : null}
diff --git a/src/components/AsideHeader/components/PageLayout/PageLayout.tsx b/src/components/AsideHeader/components/PageLayout/PageLayout.tsx
index 6938b3a3..b126ee23 100644
--- a/src/components/AsideHeader/components/PageLayout/PageLayout.tsx
+++ b/src/components/AsideHeader/components/PageLayout/PageLayout.tsx
@@ -1,8 +1,9 @@
 import React, {PropsWithChildren, Suspense, useMemo} from 'react';
 
 import {Content, ContentProps} from '../../../Content';
-import {ASIDE_HEADER_COMPACT_WIDTH, ASIDE_HEADER_EXPANDED_WIDTH} from '../../../constants';
+import {ASIDE_HEADER_EXPANDED_WIDTH} from '../../../constants';
 import {TopAlertProps} from '../../../types';
+import {getCollapsedWidth} from '../../../utils/getCollapsedWidth';
 import {AsideHeaderContextProvider, useAsideHeaderContext} from '../../AsideHeaderContext';
 import {useIsExpanded} from '../../hooks/useIsExpanded';
 import {LayoutProps} from '../../types';
@@ -31,12 +32,21 @@ function calcEstimatedTopAlertHeight(topAlert?: TopAlertProps) {
 
 export interface PageLayoutProps extends PropsWithChildren<LayoutProps> {
     onChangePinned?: (pinned: boolean) => void;
+    /** When `true`, menu items use compact height. */
+    isCompactMode?: boolean;
 }
 
-const Layout = ({pinned, className, children, topAlert, onChangePinned}: PageLayoutProps) => {
+const Layout = ({
+    pinned,
+    className,
+    children,
+    topAlert,
+    onChangePinned,
+    isCompactMode,
+}: PageLayoutProps) => {
     const {isExpanded, onExpand, onFold} = useIsExpanded(pinned);
 
-    const size = isExpanded ? ASIDE_HEADER_EXPANDED_WIDTH : ASIDE_HEADER_COMPACT_WIDTH;
+    const size = isExpanded ? ASIDE_HEADER_EXPANDED_WIDTH : getCollapsedWidth(isCompactMode);
 
     const asideHeaderContextValue = useMemo(
         () => ({
diff --git a/src/components/AsideHeader/types.tsx b/src/components/AsideHeader/types.tsx
index afb35380..9aa3def3 100644
--- a/src/components/AsideHeader/types.tsx
+++ b/src/components/AsideHeader/types.tsx
@@ -37,11 +37,14 @@ interface AsideHeaderGeneralProps extends QAProps {
     customBackground?: React.ReactNode;
     customBackgroundClassName?: string;
     hideCollapseButton?: boolean;
+    /** When `true`, menu items use compact height. */
+    isCompactMode?: boolean;
     renderContent?: RenderContentType;
     renderFooter?: (data: {
         size: number;
         isExpanded: boolean;
         asideRef: React.RefObject<HTMLDivElement>;
+        isCompactMode?: boolean;
     }) => React.ReactNode;
     collapseButtonWrapper?: (
         defaultButton: React.ReactNode,
diff --git a/src/components/AsideHeader/utils/getGroupHeight.ts b/src/components/AsideHeader/utils/getGroupHeight.ts
index d158631e..a02be010 100644
--- a/src/components/AsideHeader/utils/getGroupHeight.ts
+++ b/src/components/AsideHeader/utils/getGroupHeight.ts
@@ -1,15 +1,15 @@
-import {ITEM_HEIGHT} from '../../constants';
+import {ITEM_GAP, ITEM_HEIGHT, ITEM_HEIGHT_COMPACT} from '../../constants';
 import {MenuItemsWithGroups} from '../types';
 
-const GAP = 2;
+export function getGroupBlockHeight(items: MenuItemsWithGroups[], isCompactMode?: boolean) {
+    const itemHeight = isCompactMode ? ITEM_HEIGHT_COMPACT : ITEM_HEIGHT;
 
-export function getGroupBlockHeight(items: MenuItemsWithGroups[]) {
     if (items.length === 0) {
-        return ITEM_HEIGHT;
+        return itemHeight;
     }
 
-    const gaps = items.length * GAP;
+    const gaps = items.length * ITEM_GAP;
 
     // +1 accounts for the group header item in addition to the menu items
-    return (items.length + 1) * ITEM_HEIGHT + gaps;
+    return (items.length + 1) * itemHeight + gaps;
 }
diff --git a/src/components/Footer/mobile/__snapshots__/MobileFooter.visual.test.tsx-snapshots/MobileFooter-render-story-ManyItems-dark-chromium-linux.png b/src/components/Footer/mobile/__snapshots__/MobileFooter.visual.test.tsx-snapshots/MobileFooter-render-story-ManyItems-dark-chromium-linux.png
index d1fa5dce..706effa6 100644
Binary files a/src/components/Footer/mobile/__snapshots__/MobileFooter.visual.test.tsx-snapshots/MobileFooter-render-story-ManyItems-dark-chromium-linux.png and b/src/components/Footer/mobile/__snapshots__/MobileFooter.visual.test.tsx-snapshots/MobileFooter-render-story-ManyItems-dark-chromium-linux.png differ
diff --git a/src/components/Footer/mobile/__snapshots__/MobileFooter.visual.test.tsx-snapshots/MobileFooter-render-story-ManyItems-dark-webkit-linux.png b/src/components/Footer/mobile/__snapshots__/MobileFooter.visual.test.tsx-snapshots/MobileFooter-render-story-ManyItems-dark-webkit-linux.png
index e037004f..797907a8 100644
Binary files a/src/components/Footer/mobile/__snapshots__/MobileFooter.visual.test.tsx-snapshots/MobileFooter-render-story-ManyItems-dark-webkit-linux.png and b/src/components/Footer/mobile/__snapshots__/MobileFooter.visual.test.tsx-snapshots/MobileFooter-render-story-ManyItems-dark-webkit-linux.png differ
diff --git a/src/components/Footer/mobile/__snapshots__/MobileFooter.visual.test.tsx-snapshots/MobileFooter-render-story-ManyItems-light-chromium-linux.png b/src/components/Footer/mobile/__snapshots__/MobileFooter.visual.test.tsx-snapshots/MobileFooter-render-story-ManyItems-light-chromium-linux.png
index 8d3bee9a..dfdee60f 100644
Binary files a/src/components/Footer/mobile/__snapshots__/MobileFooter.visual.test.tsx-snapshots/MobileFooter-render-story-ManyItems-light-chromium-linux.png and b/src/components/Footer/mobile/__snapshots__/MobileFooter.visual.test.tsx-snapshots/MobileFooter-render-story-ManyItems-light-chromium-linux.png differ
diff --git a/src/components/Footer/mobile/__snapshots__/MobileFooter.visual.test.tsx-snapshots/MobileFooter-render-story-ManyItems-light-webkit-linux.png b/src/components/Footer/mobile/__snapshots__/MobileFooter.visual.test.tsx-snapshots/MobileFooter-render-story-ManyItems-light-webkit-linux.png
index 589ef845..b46b2f23 100644
Binary files a/src/components/Footer/mobile/__snapshots__/MobileFooter.visual.test.tsx-snapshots/MobileFooter-render-story-ManyItems-light-webkit-linux.png and b/src/components/Footer/mobile/__snapshots__/MobileFooter.visual.test.tsx-snapshots/MobileFooter-render-story-ManyItems-light-webkit-linux.png differ
diff --git a/src/components/Footer/mobile/__snapshots__/MobileFooter.visual.test.tsx-snapshots/MobileFooter-render-story-Showcase-dark-chromium-linux.png b/src/components/Footer/mobile/__snapshots__/MobileFooter.visual.test.tsx-snapshots/MobileFooter-render-story-Showcase-dark-chromium-linux.png
index 006e1ba2..022debe4 100644
Binary files a/src/components/Footer/mobile/__snapshots__/MobileFooter.visual.test.tsx-snapshots/MobileFooter-render-story-Showcase-dark-chromium-linux.png and b/src/components/Footer/mobile/__snapshots__/MobileFooter.visual.test.tsx-snapshots/MobileFooter-render-story-Showcase-dark-chromium-linux.png differ
diff --git a/src/components/Footer/mobile/__snapshots__/MobileFooter.visual.test.tsx-snapshots/MobileFooter-render-story-Showcase-dark-webkit-linux.png b/src/components/Footer/mobile/__snapshots__/MobileFooter.visual.test.tsx-snapshots/MobileFooter-render-story-Showcase-dark-webkit-linux.png
index 3bc8dd5f..be6013fd 100644
Binary files a/src/components/Footer/mobile/__snapshots__/MobileFooter.visual.test.tsx-snapshots/MobileFooter-render-story-Showcase-dark-webkit-linux.png and b/src/components/Footer/mobile/__snapshots__/MobileFooter.visual.test.tsx-snapshots/MobileFooter-render-story-Showcase-dark-webkit-linux.png differ
diff --git a/src/components/Footer/mobile/__snapshots__/MobileFooter.visual.test.tsx-snapshots/MobileFooter-render-story-Showcase-light-chromium-linux.png b/src/components/Footer/mobile/__snapshots__/MobileFooter.visual.test.tsx-snapshots/MobileFooter-render-story-Showcase-light-chromium-linux.png
index 9ed706cd..b14c3737 100644
Binary files a/src/components/Footer/mobile/__snapshots__/MobileFooter.visual.test.tsx-snapshots/MobileFooter-render-story-Showcase-light-chromium-linux.png and b/src/components/Footer/mobile/__snapshots__/MobileFooter.visual.test.tsx-snapshots/MobileFooter-render-story-Showcase-light-chromium-linux.png differ
diff --git a/src/components/Footer/mobile/__snapshots__/MobileFooter.visual.test.tsx-snapshots/MobileFooter-render-story-Showcase-light-webkit-linux.png b/src/components/Footer/mobile/__snapshots__/MobileFooter.visual.test.tsx-snapshots/MobileFooter-render-story-Showcase-light-webkit-linux.png
index 71c417cc..40b12918 100644
Binary files a/src/components/Footer/mobile/__snapshots__/MobileFooter.visual.test.tsx-snapshots/MobileFooter-render-story-Showcase-light-webkit-linux.png and b/src/components/Footer/mobile/__snapshots__/MobileFooter.visual.test.tsx-snapshots/MobileFooter-render-story-Showcase-light-webkit-linux.png differ
diff --git a/src/components/Logo/Logo.module.scss b/src/components/Logo/Logo.module.scss
index d9adb00c..babc0b9c 100644
--- a/src/components/Logo/Logo.module.scss
+++ b/src/components/Logo/Logo.module.scss
@@ -6,7 +6,7 @@ $block: '.#{variables.$ns}logo';
 #{$block} {
     display: flex;
     align-items: center;
-    height: 36px;
+    height: var(--_--item-height);
 
     &__btn-logo {
         display: flex;
@@ -44,7 +44,7 @@ $block: '.#{variables.$ns}logo';
     }
 
     &__logo-icon-place {
-        width: 36px;
+        width: var(--_--item-height, 36px);
 
         display: flex;
         align-items: center;
diff --git a/src/components/Logo/Logo.tsx b/src/components/Logo/Logo.tsx
index 59bdd0ed..c5abbd36 100644
--- a/src/components/Logo/Logo.tsx
+++ b/src/components/Logo/Logo.tsx
@@ -20,15 +20,19 @@ const logoTransitionClasses = {
     exitDone: b('logo-exit-done'),
 };
 
-export const Logo: React.FC<
-    LogoProps & {isExpanded?: boolean; buttonClassName?: string; iconPlaceClassName?: string}
-> = ({
+interface Props extends LogoProps {
+    isCompactMode?: boolean;
+    isExpanded?: boolean;
+    buttonClassName?: string;
+    iconPlaceClassName?: string;
+}
+
+export const Logo: React.FC<Props> = ({
     text,
     icon,
     iconSrc,
     iconClassName,
     iconPlaceClassName,
-    iconSize = 24,
     textSize = 15,
     href,
     target = '_self',
@@ -37,10 +41,14 @@ export const Logo: React.FC<
     isExpanded = true,
     className,
     buttonClassName,
+    isCompactMode,
     'aria-label': ariaLabel,
     'aria-labelledby': ariaLabelledby,
+    ...props
 }) => {
     const hasWrapper = typeof wrapper === 'function';
+    const defaultIconSize = isCompactMode ? 24 : 32;
+    const iconSize = props.iconSize || defaultIconSize;
 
     let buttonIcon;
 
diff --git a/src/components/Logo/__snapshots__/Logo.visual.test.tsx-snapshots/Logo-render-story-NoAnchor-dark-chromium-linux.png b/src/components/Logo/__snapshots__/Logo.visual.test.tsx-snapshots/Logo-render-story-NoAnchor-dark-chromium-linux.png
index f01da467..b322fbab 100644
Binary files a/src/components/Logo/__snapshots__/Logo.visual.test.tsx-snapshots/Logo-render-story-NoAnchor-dark-chromium-linux.png and b/src/components/Logo/__snapshots__/Logo.visual.test.tsx-snapshots/Logo-render-story-NoAnchor-dark-chromium-linux.png differ
diff --git a/src/components/Logo/__snapshots__/Logo.visual.test.tsx-snapshots/Logo-render-story-NoAnchor-dark-webkit-linux.png b/src/components/Logo/__snapshots__/Logo.visual.test.tsx-snapshots/Logo-render-story-NoAnchor-dark-webkit-linux.png
index 83e44fae..9d191244 100644
Binary files a/src/components/Logo/__snapshots__/Logo.visual.test.tsx-snapshots/Logo-render-story-NoAnchor-dark-webkit-linux.png and b/src/components/Logo/__snapshots__/Logo.visual.test.tsx-snapshots/Logo-render-story-NoAnchor-dark-webkit-linux.png differ
diff --git a/src/components/Logo/__snapshots__/Logo.visual.test.tsx-snapshots/Logo-render-story-NoAnchor-light-chromium-linux.png b/src/components/Logo/__snapshots__/Logo.visual.test.tsx-snapshots/Logo-render-story-NoAnchor-light-chromium-linux.png
index ebe597ce..9d3d77d0 100644
Binary files a/src/components/Logo/__snapshots__/Logo.visual.test.tsx-snapshots/Logo-render-story-NoAnchor-light-chromium-linux.png and b/src/components/Logo/__snapshots__/Logo.visual.test.tsx-snapshots/Logo-render-story-NoAnchor-light-chromium-linux.png differ
diff --git a/src/components/Logo/__snapshots__/Logo.visual.test.tsx-snapshots/Logo-render-story-NoAnchor-light-webkit-linux.png b/src/components/Logo/__snapshots__/Logo.visual.test.tsx-snapshots/Logo-render-story-NoAnchor-light-webkit-linux.png
index faf6f7a2..835d39a3 100644
Binary files a/src/components/Logo/__snapshots__/Logo.visual.test.tsx-snapshots/Logo-render-story-NoAnchor-light-webkit-linux.png and b/src/components/Logo/__snapshots__/Logo.visual.test.tsx-snapshots/Logo-render-story-NoAnchor-light-webkit-linux.png differ
diff --git a/src/components/Logo/__snapshots__/Logo.visual.test.tsx-snapshots/Logo-render-story-Showcase-dark-chromium-linux.png b/src/components/Logo/__snapshots__/Logo.visual.test.tsx-snapshots/Logo-render-story-Showcase-dark-chromium-linux.png
index f01da467..b322fbab 100644
Binary files a/src/components/Logo/__snapshots__/Logo.visual.test.tsx-snapshots/Logo-render-story-Showcase-dark-chromium-linux.png and b/src/components/Logo/__snapshots__/Logo.visual.test.tsx-snapshots/Logo-render-story-Showcase-dark-chromium-linux.png differ
diff --git a/src/components/Logo/__snapshots__/Logo.visual.test.tsx-snapshots/Logo-render-story-Showcase-dark-webkit-linux.png b/src/components/Logo/__snapshots__/Logo.visual.test.tsx-snapshots/Logo-render-story-Showcase-dark-webkit-linux.png
index 83e44fae..9d191244 100644
Binary files a/src/components/Logo/__snapshots__/Logo.visual.test.tsx-snapshots/Logo-render-story-Showcase-dark-webkit-linux.png and b/src/components/Logo/__snapshots__/Logo.visual.test.tsx-snapshots/Logo-render-story-Showcase-dark-webkit-linux.png differ
diff --git a/src/components/Logo/__snapshots__/Logo.visual.test.tsx-snapshots/Logo-render-story-Showcase-light-chromium-linux.png b/src/components/Logo/__snapshots__/Logo.visual.test.tsx-snapshots/Logo-render-story-Showcase-light-chromium-linux.png
index ebe597ce..9d3d77d0 100644
Binary files a/src/components/Logo/__snapshots__/Logo.visual.test.tsx-snapshots/Logo-render-story-Showcase-light-chromium-linux.png and b/src/components/Logo/__snapshots__/Logo.visual.test.tsx-snapshots/Logo-render-story-Showcase-light-chromium-linux.png differ
diff --git a/src/components/Logo/__snapshots__/Logo.visual.test.tsx-snapshots/Logo-render-story-Showcase-light-webkit-linux.png b/src/components/Logo/__snapshots__/Logo.visual.test.tsx-snapshots/Logo-render-story-Showcase-light-webkit-linux.png
index faf6f7a2..835d39a3 100644
Binary files a/src/components/Logo/__snapshots__/Logo.visual.test.tsx-snapshots/Logo-render-story-Showcase-light-webkit-linux.png and b/src/components/Logo/__snapshots__/Logo.visual.test.tsx-snapshots/Logo-render-story-Showcase-light-webkit-linux.png differ
diff --git a/src/components/constants.ts b/src/components/constants.ts
index cf931e54..52945b13 100644
--- a/src/components/constants.ts
+++ b/src/components/constants.ts
@@ -1,7 +1,11 @@
 export const ASIDE_HEADER_ICON_SIZE = 16;
-export const ASIDE_HEADER_COMPACT_WIDTH = 56;
+export const ASIDE_HEADER_COLLAPSED_WIDTH = 56;
+export const ASIDE_HEADER_COLLAPSED_WIDTH_COMPACT_MODE = 40;
 export const ASIDE_HEADER_EXPANDED_WIDTH = 236;
 export const ITEM_HEIGHT = 36;
+export const ITEM_HEIGHT_COMPACT = 28;
 export const HEADER_DIVIDER_HEIGHT = 29;
+export const HEADER_DIVIDER_HEIGHT_COMPACT = 22;
 export const ASIDE_HEADER_EXPAND_TRANSITION_DELAY = 150;
 export const ASIDE_HEADER_EXPAND_DELAY = 250;
+export const ITEM_GAP = 2;
diff --git a/src/components/utils/getCollapsedWidth.ts b/src/components/utils/getCollapsedWidth.ts
new file mode 100644
index 00000000..250ad171
--- /dev/null
+++ b/src/components/utils/getCollapsedWidth.ts
@@ -0,0 +1,8 @@
+import {
+    ASIDE_HEADER_COLLAPSED_WIDTH,
+    ASIDE_HEADER_COLLAPSED_WIDTH_COMPACT_MODE,
+} from '../constants';
+
+export function getCollapsedWidth(isCompactMode?: boolean): number {
+    return isCompactMode ? ASIDE_HEADER_COLLAPSED_WIDTH_COMPACT_MODE : ASIDE_HEADER_COLLAPSED_WIDTH;
+}
diff --git a/src/components/variables.scss b/src/components/variables.scss
index f862f52f..665f43b3 100644
--- a/src/components/variables.scss
+++ b/src/components/variables.scss
@@ -1 +1,11 @@
 $ns: 'gn-';
+$item-height: 36px;
+$item-height-compact: 28px;
+$item-expanded-radius: 6px;
+$item-expanded-radius-compact: 4px;
+$aside-header-min-width: 56px;
+$aside-header-min-width-compact: 40px;
+$item-margin-inline: 10px;
+$item-margin-inline-compact: 6px;
+$header-divider-height: 29px;
+$header-divider-height-compact: 22px;