diff --git a/src/elements/image/image.scss b/src/elements/image/image.scss
index 6d96e68738..8b72473527 100644
--- a/src/elements/image/image.scss
+++ b/src/elements/image/image.scss
@@ -10,6 +10,7 @@
     --sbb-disable-animation-zero-time,
     var(--sbb-animation-duration-4x)
   );
+  --sbb-image-object-fit: cover;
 
   display: block;
 }
@@ -105,7 +106,7 @@
 :is(.sbb-image__img, .sbb-image__blurred) {
   width: 100%;
   height: 100%;
-  object-fit: cover;
+  object-fit: var(--sbb-image-object-fit);
   object-position: var(--sbb-image-object-position);
   transition: opacity var(--sbb-image-animation-duration) var(--sbb-animation-easing);
 }
diff --git a/src/elements/image/image.ts b/src/elements/image/image.ts
index 20937b33ed..34da303793 100644
--- a/src/elements/image/image.ts
+++ b/src/elements/image/image.ts
@@ -158,6 +158,7 @@ const breakpointMap: Record<string, number> = {
  * @cssprop [--sbb-image-border-radius=var(--sbb-border-radius-4x)] - Can be used to override the
  * `borderRadius` property in case of different values for different viewports.
  * @cssprop [--sbb-image-object-position] - Can be used to set the object-position css property of the image itself if the image itself is cropped.
+ * @cssprop [--sbb-image-object-fit=cover] - Can be used to set the object-fit css property of the image itself if the image itself is cropped.
  */
 @customElement('sbb-image')
 export class SbbImageElement extends LitElement {
diff --git a/src/elements/image/image.visual.spec.ts b/src/elements/image/image.visual.spec.ts
index 39b278e572..a45e148a59 100644
--- a/src/elements/image/image.visual.spec.ts
+++ b/src/elements/image/image.visual.spec.ts
@@ -132,5 +132,19 @@ describe(`sbb-image`, () => {
         await waitForImageReady(setup.snapshotElement.querySelector('sbb-image')!);
       }),
     );
+
+    it(
+      'cropped with object-fit',
+      visualDiffDefault.with(async (setup) => {
+        await setup.withFixture(
+          html`<sbb-image
+            image-src=${imageUrl}
+            style="width: 200px; height: 300px; --sbb-image-object-fit: contain"
+          ></sbb-image>`,
+        );
+
+        await waitForImageReady(setup.snapshotElement.querySelector('sbb-image')!);
+      }),
+    );
   });
 });
diff --git a/src/elements/image/readme.md b/src/elements/image/readme.md
index 5d81577f21..0a33534498 100644
--- a/src/elements/image/readme.md
+++ b/src/elements/image/readme.md
@@ -41,4 +41,5 @@ The size can be set with `pictureSizesConfig`.
 | ----------------------------- | ----------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
 | `--sbb-image-aspect-ratio`    | `auto`                        | Can be used to override `aspectRatio` property. This way we can have, for example, an image component with an aspect ratio of 4/3 in smaller viewports and 16/9 in larger viewports. |
 | `--sbb-image-border-radius`   | `var(--sbb-border-radius-4x)` | Can be used to override the `borderRadius` property in case of different values for different viewports.                                                                             |
+| `--sbb-image-object-fit`      | `cover`                       | Can be used to set the object-fit css property of the image itself if the image itself is cropped.                                                                                   |
 | `--sbb-image-object-position` |                               | Can be used to set the object-position css property of the image itself if the image itself is cropped.                                                                              |