diff --git a/projects/demo-playwright/tests/kit/action-bar/action-bar.mobile.spec.ts b/projects/demo-playwright/tests/kit/action-bar/action-bar.mobile.spec.ts
index 0ec8abe194b8..7831652bfe51 100644
--- a/projects/demo-playwright/tests/kit/action-bar/action-bar.mobile.spec.ts
+++ b/projects/demo-playwright/tests/kit/action-bar/action-bar.mobile.spec.ts
@@ -19,7 +19,7 @@ test.describe('ActionBar', () => {
 
     test('works', async ({page}) => {
         await tuiGoto(page, DemoRoute.ActionBar);
-        const example = page.locator('#base');
+        const example = page.locator('#size--m');
         const showActionBarButton = example.locator('label').first();
 
         await showActionBarButton.click();
diff --git a/projects/demo-playwright/tests/kit/action-bar/action-bar.spec.ts b/projects/demo-playwright/tests/kit/action-bar/action-bar.spec.ts
index 6dc5fec8bf28..c4b7bfc2e941 100644
--- a/projects/demo-playwright/tests/kit/action-bar/action-bar.spec.ts
+++ b/projects/demo-playwright/tests/kit/action-bar/action-bar.spec.ts
@@ -9,7 +9,7 @@ test.describe('ActionBar', () => {
 
     test('works', async ({page}) => {
         await tuiGoto(page, DemoRoute.ActionBar);
-        const example = page.locator('#base');
+        const example = page.locator('#size--m');
         const showActionBarButton = example.locator('label').first();
 
         await showActionBarButton.click();
diff --git a/projects/demo/src/modules/app/pages.ts b/projects/demo/src/modules/app/pages.ts
index 392e0fedbe92..b64ba7687a5b 100644
--- a/projects/demo/src/modules/app/pages.ts
+++ b/projects/demo/src/modules/app/pages.ts
@@ -891,7 +891,7 @@ export const pages: TuiDocRoutePages = [
     {
         section: 'Navigation',
         title: 'Segmented',
-        keywords: 'tabs, control, radio, navigation, навигация, beaver, вкладки, таб',
+        keywords: 'tabs, control, radio, navigation, навигация, вкладки, таб',
         route: DemoRoute.Segmented,
     },
     {
@@ -934,7 +934,7 @@ export const pages: TuiDocRoutePages = [
     {
         section: 'Layout',
         title: 'Navigation',
-        keywords: 'шапка, header, sidebar, aside, сайдбар, навигация',
+        keywords: 'шапка, header, sidebar, aside, сайдбар, навигация, beaver',
         route: DemoRoute.Navigation,
     },
     {
diff --git a/projects/demo/src/modules/components/action-bar/examples/1/index.html b/projects/demo/src/modules/components/action-bar/examples/1/index.html
index db0ca43c37e5..b24835ad8aa4 100644
--- a/projects/demo/src/modules/components/action-bar/examples/1/index.html
+++ b/projects/demo/src/modules/components/action-bar/examples/1/index.html
@@ -68,42 +68,91 @@
                 </span>
             </button>
         </tui-opt-group>
+        <tui-opt-group>
+            <button
+                *tuiRepeatTimes="let index of 5"
+                role="menuitem"
+                tuiOption
+                type="button"
+            >
+                <span>
+                    <tui-icon
+                        icon="@tui.star"
+                        class="tui-space_right-3"
+                    />
+                    Action {{ index + 1 }}
+                </span>
+            </button>
+        </tui-opt-group>
     </tui-data-list>
 
     <div>
-        Selected: {{ selected }} of {{ items.length }}
-
+        <strong>Selected: {{ selected }} of {{ items.length }}</strong>
         <button
             *ngIf="!isMobile()"
-            appearance="icon"
             tuiLink
             type="button"
             class="tui-space_left-3"
-            [pseudo]="true"
             (click)="toggleSelect()"
         >
             {{ selected < items.length ? 'Select all' : 'Select none' }}
         </button>
     </div>
 
+    <tui-items-with-more>
+        <ng-container *tuiRepeatTimes="let index of 5">
+            <button
+                *tuiItem
+                iconStart="@tui.star"
+                tuiButton
+                type="button"
+            >
+                Action {{ index + 1 }}
+            </button>
+        </ng-container>
+        <ng-template
+            let-lastIndex
+            tuiMore
+        >
+            <button
+                iconStart="@tui.ellipsis"
+                tuiButton
+                tuiDropdownAlign="right"
+                tuiDropdownOpen
+                type="button"
+                [tuiDropdown]="dropdown"
+            >
+                More
+            </button>
+            <ng-template #dropdown>
+                <tui-data-list size="l">
+                    <ng-container *tuiRepeatTimes="let index of 5">
+                        <button
+                            *ngIf="index > lastIndex"
+                            tuiOption
+                            type="button"
+                        >
+                            Action {{ index + 1 }}
+                        </button>
+                    </ng-container>
+                </tui-data-list>
+            </ng-template>
+        </ng-template>
+    </tui-items-with-more>
+
     <button
-        appearance="glass"
+        *ngIf="!isMobile()"
         iconStart="@tui.send"
-        size="m"
         tuiButton
         type="button"
-        [disabled]="expanded"
     >
-        {{ isMobile() ? '' : 'Send' }}
+        Send
     </button>
     <button
         *ngIf="!isMobile()"
-        appearance="glass"
         iconStart="@tui.trash"
-        size="m"
         tuiButton
         type="button"
-        [disabled]="expanded"
         (click)="close()"
     >
         Delete
@@ -111,9 +160,15 @@
 
     <button
         *ngIf="isMobile()"
-        appearance="glass"
+        iconStart="@tui.send"
+        tuiIconButton
+        type="button"
+    >
+        Send
+    </button>
+    <button
+        *ngIf="isMobile()"
         iconStart="@tui.ellipsis"
-        size="m"
         tuiIconButton
         type="button"
         (click)="expanded = !expanded"
@@ -125,7 +180,6 @@
         *ngIf="!isMobile()"
         appearance="icon"
         iconStart="@tui.x"
-        size="m"
         tuiIconButton
         type="button"
         (click)="close()"
diff --git a/projects/demo/src/modules/components/action-bar/examples/1/index.less b/projects/demo/src/modules/components/action-bar/examples/1/index.less
deleted file mode 100644
index bd3ce6aabef8..000000000000
--- a/projects/demo/src/modules/components/action-bar/examples/1/index.less
+++ /dev/null
@@ -1,5 +0,0 @@
-:host {
-    display: flex;
-    align-items: center;
-    gap: 0.5rem;
-}
diff --git a/projects/demo/src/modules/components/action-bar/examples/1/index.ts b/projects/demo/src/modules/components/action-bar/examples/1/index.ts
index 027ff63add94..98915c55707f 100644
--- a/projects/demo/src/modules/components/action-bar/examples/1/index.ts
+++ b/projects/demo/src/modules/components/action-bar/examples/1/index.ts
@@ -1,33 +1,38 @@
-import {NgIf} from '@angular/common';
+import {NgForOf, NgIf} from '@angular/common';
 import {Component, inject} from '@angular/core';
 import {toSignal} from '@angular/core/rxjs-interop';
 import {FormControl, ReactiveFormsModule} from '@angular/forms';
 import {changeDetection} from '@demo/emulate/change-detection';
 import {encapsulation} from '@demo/emulate/encapsulation';
+import {TuiRepeatTimes} from '@taiga-ui/cdk';
 import {
     TuiBreakpointService,
     TuiButton,
     TuiDataList,
+    TuiDropdown,
     TuiIcon,
     TuiLink,
 } from '@taiga-ui/core';
-import {TuiActionBar, TuiFilter} from '@taiga-ui/kit';
+import {TuiActionBar, TuiFilter, TuiItemsWithMore} from '@taiga-ui/kit';
 import {map} from 'rxjs';
 
 @Component({
     standalone: true,
     imports: [
+        NgForOf,
         NgIf,
         ReactiveFormsModule,
         TuiActionBar,
         TuiButton,
         TuiDataList,
+        TuiDropdown,
         TuiFilter,
         TuiIcon,
+        TuiItemsWithMore,
         TuiLink,
+        TuiRepeatTimes,
     ],
     templateUrl: './index.html',
-    styleUrls: ['./index.less'],
     encapsulation,
     changeDetection,
 })
diff --git a/projects/demo/src/modules/components/action-bar/examples/2/index.html b/projects/demo/src/modules/components/action-bar/examples/2/index.html
index 2e9b0fdf9b58..fd2ccd81a34e 100644
--- a/projects/demo/src/modules/components/action-bar/examples/2/index.html
+++ b/projects/demo/src/modules/components/action-bar/examples/2/index.html
@@ -7,15 +7,27 @@
     Show TableBar
 </button>
 
-<tui-action-bar *tuiActionBar="open()">
-    <span>Table bar opened</span>
+<tui-action-bar
+    *tuiActionBar="open()"
+    size="s"
+>
+    <span [style.width.%]="isMobile() ? 100 : null">Table bar opened</span>
 
     <button
         appearance="glass"
-        size="m"
+        iconStart="@tui.trash"
         tuiButton
         type="button"
         (click)="open.set(false)"
+    >
+        Remove
+    </button>
+    <button
+        iconStart="@tui.x"
+        tuiIconButton
+        type="button"
+        [appearance]="isMobile() ? 'glass' : 'icon'"
+        (click)="open.set(false)"
     >
         Close
     </button>
diff --git a/projects/demo/src/modules/components/action-bar/examples/2/index.less b/projects/demo/src/modules/components/action-bar/examples/2/index.less
deleted file mode 100644
index f01b0f68fc8d..000000000000
--- a/projects/demo/src/modules/components/action-bar/examples/2/index.less
+++ /dev/null
@@ -1,5 +0,0 @@
-tui-action-bar {
-    left: 3rem;
-    right: 3rem;
-    background: var(--tui-chart-categorical-13);
-}
diff --git a/projects/demo/src/modules/components/action-bar/examples/2/index.ts b/projects/demo/src/modules/components/action-bar/examples/2/index.ts
index beaaa3548002..577ab632fc9b 100644
--- a/projects/demo/src/modules/components/action-bar/examples/2/index.ts
+++ b/projects/demo/src/modules/components/action-bar/examples/2/index.ts
@@ -1,15 +1,23 @@
-import {Component, signal} from '@angular/core';
+import {NgIf} from '@angular/common';
+import {Component, inject, signal} from '@angular/core';
+import {toSignal} from '@angular/core/rxjs-interop';
 import {changeDetection} from '@demo/emulate/change-detection';
-import {TuiButton} from '@taiga-ui/core';
+import {encapsulation} from '@demo/emulate/encapsulation';
+import {TuiBreakpointService, TuiButton} from '@taiga-ui/core';
 import {TuiActionBar} from '@taiga-ui/kit';
+import {map} from 'rxjs';
 
 @Component({
     standalone: true,
-    imports: [TuiActionBar, TuiButton],
+    imports: [NgIf, TuiActionBar, TuiButton],
     templateUrl: './index.html',
-    styleUrls: ['./index.less'],
+    encapsulation,
     changeDetection,
 })
 export default class Example {
     protected open = signal(false);
+
+    protected readonly isMobile = toSignal(
+        inject(TuiBreakpointService).pipe(map((size) => size === 'mobile')),
+    );
 }
diff --git a/projects/demo/src/modules/components/action-bar/index.html b/projects/demo/src/modules/components/action-bar/index.html
index 679d016ae2f4..b0bcf522593a 100644
--- a/projects/demo/src/modules/components/action-bar/index.html
+++ b/projects/demo/src/modules/components/action-bar/index.html
@@ -4,23 +4,15 @@
     type="components"
 >
     <ng-template pageTab>
-        <p>
-            It is an element on the bottom of screen to show actions by multiselect of some items. It works with custom
-            content.
-        </p>
+        It is an element on the bottom of screen to show actions by multiselect of some items. It works with custom
+        content.
 
         <tui-doc-example
-            id="base"
-            heading="Basic"
-            [component]="1 | tuiComponent"
-            [content]="1 | tuiExample"
-        />
-
-        <tui-doc-example
-            id="directive"
-            heading="Customization"
-            [component]="2 | tuiComponent"
-            [content]="2 | tuiExample"
+            *ngFor="let example of examples; let index = index"
+            [component]="index + 1 | tuiComponent"
+            [content]="index + 1 | tuiExample"
+            [heading]="example"
+            [id]="example | tuiKebab"
         />
     </ng-template>
 
diff --git a/projects/demo/src/modules/components/action-bar/index.ts b/projects/demo/src/modules/components/action-bar/index.ts
index d8d72f53e33b..2759645d6635 100644
--- a/projects/demo/src/modules/components/action-bar/index.ts
+++ b/projects/demo/src/modules/components/action-bar/index.ts
@@ -9,4 +9,6 @@ import {TuiDemo} from '@demo/utils';
     styleUrls: ['./index.less'],
     changeDetection,
 })
-export default class Page {}
+export default class Page {
+    protected readonly examples = ['Size M', 'Size S'];
+}
diff --git a/projects/demo/used-icons.ts b/projects/demo/used-icons.ts
index c53ea95328d4..d6b3fd11ed1c 100644
--- a/projects/demo/used-icons.ts
+++ b/projects/demo/used-icons.ts
@@ -19,13 +19,13 @@ export const TUI_USED_ICONS = [
     '@tui.trash',
     '@tui.layout-grid',
     '@tui.x',
+    '@tui.star',
     '@tui.check',
     '@tui.user',
     '@tui.chevron-left',
     '@tui.mastercard',
     '@tui.box',
     '@tui.lock',
-    '@tui.star',
     '@tui.gift',
     '@tui.arrow-right',
     '@tui.users',
diff --git a/projects/kit/components/action-bar/action-bar.component.ts b/projects/kit/components/action-bar/action-bar.component.ts
index c6ab38738fc7..495f433128d6 100644
--- a/projects/kit/components/action-bar/action-bar.component.ts
+++ b/projects/kit/components/action-bar/action-bar.component.ts
@@ -1,7 +1,12 @@
 import {ChangeDetectionStrategy, Component, inject, Input} from '@angular/core';
+import {tuiProvide} from '@taiga-ui/cdk/utils/miscellaneous';
 import {tuiFadeIn, tuiSlideInTop} from '@taiga-ui/core/animations';
+import type {TuiButtonOptions} from '@taiga-ui/core/components/button';
+import {TUI_BUTTON_OPTIONS} from '@taiga-ui/core/components/button';
 import {TuiExpandComponent} from '@taiga-ui/core/components/expand';
+import {tuiLinkOptionsProvider} from '@taiga-ui/core/components/link';
 import {TUI_ANIMATIONS_SPEED} from '@taiga-ui/core/tokens';
+import type {TuiSizeS} from '@taiga-ui/core/types';
 import {tuiToAnimationOptions} from '@taiga-ui/core/utils/miscellaneous';
 
 @Component({
@@ -11,16 +16,26 @@ import {tuiToAnimationOptions} from '@taiga-ui/core/utils/miscellaneous';
     templateUrl: './action-bar.template.html',
     styleUrls: ['./action-bar.style.less'],
     changeDetection: ChangeDetectionStrategy.OnPush,
+    providers: [
+        tuiProvide(TUI_BUTTON_OPTIONS, TuiActionBarComponent),
+        tuiLinkOptionsProvider({appearance: 'icon', pseudo: true}),
+    ],
     animations: [tuiFadeIn, tuiSlideInTop],
     host: {
         tuiTheme: 'dark',
+        '[attr.data-size]': 'size',
         '[@tuiFadeIn]': 'animation',
         '[@tuiSlideInTop]': 'animation',
     },
 })
-export class TuiActionBarComponent {
+export class TuiActionBarComponent implements TuiButtonOptions {
     protected readonly animation = tuiToAnimationOptions(inject(TUI_ANIMATIONS_SPEED));
 
     @Input()
     public expanded = false;
+
+    @Input()
+    public size: TuiSizeS = 'm';
+
+    public readonly appearance = 'glass';
 }
diff --git a/projects/kit/components/action-bar/action-bar.style.less b/projects/kit/components/action-bar/action-bar.style.less
index 10a7bb4ae76e..924c6a459086 100644
--- a/projects/kit/components/action-bar/action-bar.style.less
+++ b/projects/kit/components/action-bar/action-bar.style.less
@@ -2,37 +2,70 @@
 
 :host {
     position: fixed;
-    left: 1rem;
-    right: 1rem;
+    left: ~'max(calc(50% - 37rem), 1.5rem)';
     bottom: 1rem;
     display: flex;
+    inline-size: 100%;
+    max-inline-size: ~'min(calc(100vw - 3rem), 74rem)';
     box-sizing: border-box;
-    min-block-size: 4rem;
-    border-radius: var(--tui-radius-xl);
+    border-radius: 1rem;
     background: var(--tui-service-backdrop);
     color: var(--tui-text-primary);
     backdrop-filter: blur(2rem);
     flex-direction: column;
     justify-content: center;
-    padding: 0.625rem;
+    padding: 0.75rem;
+    text-indent: 0.75rem;
+    font: var(--tui-font-text-m);
+    white-space: nowrap;
+
+    &[data-size='s'] {
+        border-radius: var(--tui-radius-l);
+        font: var(--tui-font-text-s);
+        padding: 0.5rem;
+    }
+
+    :host-context(tui-root._mobile) & {
+        padding: 1rem;
+        border-radius: 1.25rem;
+        text-indent: 0;
+    }
 
     ::ng-deep tui-data-list[data-size] {
-        padding: 0.25rem 0 0.5rem;
+        padding: 0;
+        margin: -0.625rem -0.625rem 1rem;
+    }
+
+    ::ng-deep tui-items-with-more {
+        text-indent: 0.5rem;
+
+        :host-context(tui-root._mobile) & {
+            display: none;
+        }
     }
 }
 
 .t-content {
     display: flex;
-    justify-content: space-between;
     align-items: center;
-    padding-left: 0.625rem;
+    gap: 0.7rem 2.5rem;
+
+    :host-context(tui-root._mobile) & {
+        flex-wrap: wrap;
+    }
 }
 
 .t-actions {
     display: flex;
+    justify-content: flex-end;
     gap: 0.5rem;
+    margin-inline-start: auto;
 
     :host-context(tui-root._mobile) & {
-        gap: 0.375rem;
+        flex: 1;
+
+        ::ng-deep [tuiButton] {
+            flex: 1;
+        }
     }
 }
diff --git a/projects/kit/components/items-with-more/items-with-more.style.less b/projects/kit/components/items-with-more/items-with-more.style.less
index 2df16972d7cd..5a684c894629 100644
--- a/projects/kit/components/items-with-more/items-with-more.style.less
+++ b/projects/kit/components/items-with-more/items-with-more.style.less
@@ -1,6 +1,8 @@
 :host {
     position: relative;
     display: flex;
+    min-inline-size: 0;
+    flex: 1;
     align-items: center;
     white-space: nowrap;
 }