diff --git a/src/elements/teaser-hero/teaser-hero.scss b/src/elements/teaser-hero/teaser-hero.scss
index 7941917cab..de288345e2 100644
--- a/src/elements/teaser-hero/teaser-hero.scss
+++ b/src/elements/teaser-hero/teaser-hero.scss
@@ -10,7 +10,7 @@
   // which appears in normalize css of several frameworks.
   outline: none !important;
 
-  --sbb-teaser-hero-brightness-hover: 1.075;
+  --sbb-teaser-hero-brightness-hover: var(--sbb-hover-image-brightness);
   --sbb-teaser-hero-chip-inset: var(--sbb-spacing-responsive-xxxs) auto auto
     var(--sbb-spacing-responsive-xxxs);
 
diff --git a/src/elements/teaser-product/teaser-product/teaser-product.scss b/src/elements/teaser-product/teaser-product/teaser-product.scss
index cef59ac7fe..211d39b937 100644
--- a/src/elements/teaser-product/teaser-product/teaser-product.scss
+++ b/src/elements/teaser-product/teaser-product/teaser-product.scss
@@ -1,7 +1,7 @@
 @use '../../core/styles/index' as sbb;
 
 :host {
-  --sbb-teaser-product-brightness-hover: 1.075;
+  --sbb-teaser-product-brightness-hover: var(--sbb-hover-image-brightness);
   --sbb-teaser-product-animation-duration: var(
     --sbb-disable-animation-zero-time,
     var(--sbb-animation-duration-4x)
diff --git a/src/elements/teaser/teaser.scss b/src/elements/teaser/teaser.scss
index 060d57f03d..370f03a3fa 100644
--- a/src/elements/teaser/teaser.scss
+++ b/src/elements/teaser/teaser.scss
@@ -17,7 +17,7 @@
   --sbb-teaser-gap: var(--sbb-spacing-fixed-4x);
   --sbb-teaser-width: fit-content;
   --sbb-teaser-border-radius: var(--sbb-border-radius-4x);
-  --sbb-teaser-brightness-hover: 1.075;
+  --sbb-teaser-brightness-hover: var(--sbb-hover-image-brightness);
   --sbb-teaser-animation-duration: var(
     --sbb-disable-animation-zero-time,
     var(--sbb-animation-duration-4x)