diff --git a/.loki/reference/chrome_laptop_embed_PublicOrEmbeddedDashboardView_Transparent_Theme_Default.png b/.loki/reference/chrome_laptop_embed_PublicOrEmbeddedDashboardView_Transparent_Theme_Default.png
index 15de21cbb1d784986211901b615cccb529c944f3..58e53f48eaf65a297113c3991bc123386ad24f9d 100644
Binary files a/.loki/reference/chrome_laptop_embed_PublicOrEmbeddedDashboardView_Transparent_Theme_Default.png and b/.loki/reference/chrome_laptop_embed_PublicOrEmbeddedDashboardView_Transparent_Theme_Default.png differ
diff --git a/.loki/reference/chrome_laptop_embed_PublicOrEmbeddedDashboardView_Transparent_Theme_Scroll.png b/.loki/reference/chrome_laptop_embed_PublicOrEmbeddedDashboardView_Transparent_Theme_Scroll.png
index 8bea6b6c6676c56fc58cf58a2186a990901210a4..32ca043966be5ee257d842c10b88ba3c9331cc9f 100644
Binary files a/.loki/reference/chrome_laptop_embed_PublicOrEmbeddedDashboardView_Transparent_Theme_Scroll.png and b/.loki/reference/chrome_laptop_embed_PublicOrEmbeddedDashboardView_Transparent_Theme_Scroll.png differ
diff --git a/.loki/reference/chrome_laptop_embed_PublicOrEmbeddedQuestionView_Transparent_Theme_Default.png b/.loki/reference/chrome_laptop_embed_PublicOrEmbeddedQuestionView_Transparent_Theme_Default.png
index 7ed3a437a5b85d52d7a7187f9a4d6b00ab3eb040..cc2e566b59f0e377a7ca53be5f966e672463541e 100644
Binary files a/.loki/reference/chrome_laptop_embed_PublicOrEmbeddedQuestionView_Transparent_Theme_Default.png and b/.loki/reference/chrome_laptop_embed_PublicOrEmbeddedQuestionView_Transparent_Theme_Default.png differ
diff --git a/frontend/src/metabase/dashboard/components/DashboardGrid.styled.tsx b/frontend/src/metabase/dashboard/components/DashboardGrid.styled.tsx
index 7204db1601bc48f7f119f387733ad1b3cab4e0b5..95c2192b6b03a981a13f3890b37efd18f177644d 100644
--- a/frontend/src/metabase/dashboard/components/DashboardGrid.styled.tsx
+++ b/frontend/src/metabase/dashboard/components/DashboardGrid.styled.tsx
@@ -2,6 +2,7 @@ import { css } from "@emotion/react";
 import styled from "@emotion/styled";
 
 import DashboardS from "metabase/css/dashboard.module.css";
+import { isEmbeddingSdk } from "metabase/env";
 import type { MantineTheme } from "metabase/ui";
 import { SAVING_DOM_IMAGE_CLASS } from "metabase/visualizations/lib/save-chart-image";
 
@@ -41,12 +42,22 @@ export const DashboardCardContainer = styled.div<DashboardCardProps>`
   }
 
   .${SAVING_DOM_IMAGE_CLASS} & .${DashboardS.Card} {
-    // the renderer we use for saving to image/pdf doesn't support box-shadow
-    // so we replace it with a border
+    /* the renderer we use for saving to image/pdf doesn't support box-shadow
+       so we replace it with a border */
     box-shadow: none;
     border: 1px solid var(--mb-color-border);
   }
 
+  /* the renderer for saving to image/pdf does not support text overflow
+     with line height in custom themes in the embedding sdk.
+     this is a workaround to make sure the text is not clipped vertically */
+  ${isEmbeddingSdk &&
+  css`
+    .${SAVING_DOM_IMAGE_CLASS} & .${DashboardS.Card} * {
+      overflow: visible !important;
+    }
+  `};
+
   ${props =>
     props.isAnimationDisabled
       ? css`
diff --git a/frontend/src/metabase/public/components/EmbedFrame/EmbedFrame.module.css b/frontend/src/metabase/public/components/EmbedFrame/EmbedFrame.module.css
index 0d725dc460c0e2017d6cc6246d4e06091fa7f342..265b48558d6da4630f0dd2a63fd575593dabfd21 100644
--- a/frontend/src/metabase/public/components/EmbedFrame/EmbedFrame.module.css
+++ b/frontend/src/metabase/public/components/EmbedFrame/EmbedFrame.module.css
@@ -10,8 +10,15 @@ body {
 
 .EmbedFrame {
   color: var(--mb-color-text-primary);
+}
+
+.EmbedFrame,
+/* this is to make it work when exporting to pdfs, where the EmbedFrame is not part of the exported dom */
+.WithThemeBackground {
   background-color: var(--mb-color-bg-dashboard);
+  border-color: var(--mb-color-border);
 }
+
 /* A temporary solution until we migrated all colors in visualization to use semantic colors
    e.g. `text-primary`, `text-secondary`, `text-tertiary`. */
 .EmbedFrame svg text {
@@ -60,14 +67,6 @@ body {
   --mb-color-background-disabled: var(--mb-base-color-gray-70);
   --mb-color-background-brand: var(--mb-base-color-brand-60);
 
-  .EmbedFrame,
-    /* this is to make it work when exporting to pdfs,
-  where the EmbedFrame is not part of the exported dom */
-      .WithThemeBackground {
-    background-color: var(--mb-color-bg-dashboard);
-    border-color: var(--mb-color-border);
-  }
-
   .EmbedFrameHeader,
   .EmbedFrameFooter {
     background-color: var(--mb-color-bg-dashboard);
@@ -101,6 +100,10 @@ body {
     }
   }
 
+  .WithThemeBackground {
+    background-color: transparent;
+  }
+
   .EmbedFrameHeader,
   .EmbedFrameFooter {
     background-color: transparent;