diff --git a/packages/web/src/scss/components/Alert/README.md b/packages/web/src/scss/components/Alert/README.md
index 4dff034fbc..b1e119b7a3 100644
--- a/packages/web/src/scss/components/Alert/README.md
+++ b/packages/web/src/scss/components/Alert/README.md
@@ -67,3 +67,20 @@ Variants:
   <div>Data update failed due to missing internet connection</div>
 </div>
 ```
+
+## Feature Flag: Bordered Alert
+
+The Alert border feature flag is not disabled by default. To enable it, either set the
+`$alert-enable-bordered` Sass feature flag to `true` or use the `spirit-feature-alert-enable-bordered`
+CSS class on any parent of the Alert.
+
+For more info, see main [README][readme-feature-flags].
+
+### ⚠️ DEPRECATION NOTICE
+
+The Alert will be bordered by default in the next major release.
+
+[What are deprecations?][readme-deprecations]
+
+[readme-deprecations]: https://github.com/lmc-eu/spirit-design-system/tree/main/packages/web/README.md#deprecations
+[readme-feature-flags]: https://github.com/lmc-eu/spirit-design-system/tree/main/packages/web/README.md#feature-flags
diff --git a/packages/web/src/scss/components/Alert/_Alert.scss b/packages/web/src/scss/components/Alert/_Alert.scss
index 7c2aae799b..36b8c8dbe0 100644
--- a/packages/web/src/scss/components/Alert/_Alert.scss
+++ b/packages/web/src/scss/components/Alert/_Alert.scss
@@ -1,4 +1,5 @@
 @use 'theme';
+@use '../../settings/feature-flags';
 @use '../../tools/dictionaries';
 @use '../../tools/typography';
 
@@ -12,6 +13,18 @@
     width: 100%;
     padding: theme.$padding;
     border-radius: theme.$border-radius;
+
+    // @deprecated The feature flag will be removed in the next major version.
+    // Migration: delete this feature flag and make the bordered version the default.
+    @if feature-flags.$alert-enable-bordered {
+        border: theme.$border-width theme.$border-style var(--alert-color);
+    }
+}
+
+// @deprecated The feature flag will be removed in the next major version.
+// Migration: delete this feature flag and make the bordered version the default.
+.spirit-feature-alert-enable-bordered .Alert {
+    border: theme.$border-width theme.$border-style var(--alert-color);
 }
 
 .Alert strong {
diff --git a/packages/web/src/scss/components/Alert/_theme.scss b/packages/web/src/scss/components/Alert/_theme.scss
index 5f485dcd74..f74446895d 100644
--- a/packages/web/src/scss/components/Alert/_theme.scss
+++ b/packages/web/src/scss/components/Alert/_theme.scss
@@ -7,6 +7,8 @@ $typography: tokens.$body-medium-text-regular;
 $gap: tokens.$space-600;
 $padding: tokens.$space-600;
 $border-radius: tokens.$radius-200;
+$border-style: tokens.$border-style-100;
+$border-width: tokens.$border-width-100;
 
 $content-max-width: 640px;
 
diff --git a/packages/web/src/scss/components/Alert/index.html b/packages/web/src/scss/components/Alert/index.html
index 057d7b40dd..97b32a2665 100644
--- a/packages/web/src/scss/components/Alert/index.html
+++ b/packages/web/src/scss/components/Alert/index.html
@@ -123,4 +123,47 @@ <h2 class="docs-Heading">Alert Icons</h2>
 
 </section>
 
+<div class="spirit-feature-alert-enable-bordered">
+  <section class="docs-Section">
+    <h2 class="docs-Heading">Feature Flag: Bordered Alert</h2>
+
+    <div class="docs-Stack docs-Stack--stretch">
+
+      <div class="Alert Alert--success" role="alert">
+        <svg width="24" height="24">
+          <use xlink:href="/icons/svg/sprite.svg#check-plain" />
+        </svg>
+        <div>We sent you an activation link to email <strong>spirit@lmc.eu</strong>. See <a href="./" class="link-underlined">FAQ</a> for more info.</div>
+      </div>
+
+      <div class="Alert Alert--informative" role="alert">
+        <svg width="24" height="24">
+          <use xlink:href="/icons/svg/sprite.svg#info" />
+        </svg>
+        <div>
+          Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aliquam at excepturi laudantium magnam mollitia
+          perferendis reprehenderit, voluptate. Cum delectus dicta ducimus eligendi excepturi natus perferendis
+          provident unde. Eveniet, iste, molestiae? See <a href="./" class="link-underlined">FAQ</a> for more info.
+        </div>
+      </div>
+
+      <div class="Alert Alert--warning" role="alert">
+        <svg width="24" height="24">
+          <use xlink:href="/icons/svg/sprite.svg#warning" />
+        </svg>
+        <div><strong>Warning!</strong> Data update failed due to missing internet connection. See <a href="./" class="link-underlined">FAQ</a> for more info.</div>
+      </div>
+
+      <div class="Alert Alert--danger" role="alert">
+        <svg width="24" height="24">
+          <use xlink:href="/icons/svg/sprite.svg#danger" />
+        </svg>
+        <div>Data update failed due to missing internet connection. See <a href="./" class="link-underlined">FAQ</a> for more info.</div>
+      </div>
+
+    </div>
+
+  </section>
+</div>
+
 {{/layout/plain }}
diff --git a/packages/web/src/scss/settings/_feature-flags.scss b/packages/web/src/scss/settings/_feature-flags.scss
index 25c69b50e2..66389a0c61 100644
--- a/packages/web/src/scss/settings/_feature-flags.scss
+++ b/packages/web/src/scss/settings/_feature-flags.scss
@@ -1,3 +1,4 @@
+$alert-enable-bordered: false !default;
 $dropdown-enable-enhanced-shadow: false !default;
 $modal-enable-uniform-dialog: false !default;
 $tooltip-enable-data-placement: false !default;
diff --git a/tests/e2e/demo-components-compare.spec.ts-snapshots/alert-chromium-linux.png b/tests/e2e/demo-components-compare.spec.ts-snapshots/alert-chromium-linux.png
index 304b4c3c8b..0e212b1eb0 100644
Binary files a/tests/e2e/demo-components-compare.spec.ts-snapshots/alert-chromium-linux.png and b/tests/e2e/demo-components-compare.spec.ts-snapshots/alert-chromium-linux.png differ