diff --git a/alfa-client/libs/design-system/src/index.ts b/alfa-client/libs/design-system/src/index.ts
index 43915a1cbbb0269a3f519fc045b757639dc63a7c..75cf45074d60ef259b865f81f143896ef3c778c1 100644
--- a/alfa-client/libs/design-system/src/index.ts
+++ b/alfa-client/libs/design-system/src/index.ts
@@ -19,6 +19,7 @@ export * from './lib/icons/collaboration-icon/collaboration-icon.component';
 export * from './lib/icons/exclamation-icon/exclamation-icon.component';
 export * from './lib/icons/file-icon/file-icon.component';
 export * from './lib/icons/iconVariants';
+export * from './lib/icons/logout-icon/logout-icon.component';
 export * from './lib/icons/office-icon/office-icon.component';
 export * from './lib/icons/save-icon/save-icon.component';
 export * from './lib/icons/search-icon/search-icon.component';
diff --git a/alfa-client/libs/design-system/src/lib/icons/logout-icon/logout-icon.component.spec.ts b/alfa-client/libs/design-system/src/lib/icons/logout-icon/logout-icon.component.spec.ts
new file mode 100644
index 0000000000000000000000000000000000000000..480de053d282d568be7651299ff74244c77f64c4
--- /dev/null
+++ b/alfa-client/libs/design-system/src/lib/icons/logout-icon/logout-icon.component.spec.ts
@@ -0,0 +1,21 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { LogoutIconComponent } from './logout-icon.component';
+
+describe('LogoutIconComponent', () => {
+  let component: LogoutIconComponent;
+  let fixture: ComponentFixture<LogoutIconComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [LogoutIconComponent],
+    }).compileComponents();
+
+    fixture = TestBed.createComponent(LogoutIconComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/alfa-client/libs/design-system/src/lib/icons/logout-icon/logout-icon.component.ts b/alfa-client/libs/design-system/src/lib/icons/logout-icon/logout-icon.component.ts
new file mode 100644
index 0000000000000000000000000000000000000000..030b3a9502b7f12793f40bc6bbe5d2a740804d47
--- /dev/null
+++ b/alfa-client/libs/design-system/src/lib/icons/logout-icon/logout-icon.component.ts
@@ -0,0 +1,27 @@
+import { NgClass } from '@angular/common';
+import { Component, Input } from '@angular/core';
+import { twMerge } from 'tailwind-merge';
+
+import { IconVariants, iconVariants } from '../iconVariants';
+
+@Component({
+  selector: 'ods-logout-icon',
+  standalone: true,
+  imports: [NgClass],
+  template: `<svg
+    [ngClass]="twMerge(iconVariants({ size }), 'fill-text', class)"
+    viewBox="0 0 24 24"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <path
+      d="M5 21C4.45 21 3.97917 20.8042 3.5875 20.4125C3.19583 20.0208 3 19.55 3 19V5C3 4.45 3.19583 3.97917 3.5875 3.5875C3.97917 3.19583 4.45 3 5 3H12V5H5V19H12V21H5ZM16 17L14.625 15.55L17.175 13H9V11H17.175L14.625 8.45L16 7L21 12L16 17Z"
+    />
+  </svg>`,
+})
+export class LogoutIconComponent {
+  @Input() size: IconVariants['size'] = 'medium';
+  @Input() class: string = '';
+
+  readonly iconVariants = iconVariants;
+  readonly twMerge = twMerge;
+}
diff --git a/alfa-client/libs/design-system/src/lib/icons/logout-icon/logout-icon.stories.ts b/alfa-client/libs/design-system/src/lib/icons/logout-icon/logout-icon.stories.ts
new file mode 100644
index 0000000000000000000000000000000000000000..f09a093d0502d2142acfeeb343db9dc90db2b149
--- /dev/null
+++ b/alfa-client/libs/design-system/src/lib/icons/logout-icon/logout-icon.stories.ts
@@ -0,0 +1,27 @@
+import type { Meta, StoryObj } from '@storybook/angular';
+
+import { LogoutIconComponent } from './logout-icon.component';
+
+const meta: Meta<LogoutIconComponent> = {
+  title: 'Icons/Logout icon',
+  component: LogoutIconComponent,
+  excludeStories: /.*Data$/,
+  tags: ['autodocs'],
+};
+
+export default meta;
+type Story = StoryObj<LogoutIconComponent>;
+
+export const Default: Story = {
+  args: { size: 'medium' },
+  argTypes: {
+    size: {
+      control: 'select',
+      options: ['small', 'medium', 'large', 'extra-large', 'full'],
+      description: 'Size of icon. Property "full" means 100%',
+      table: {
+        defaultValue: { summary: 'medium' },
+      },
+    },
+  },
+};