diff --git a/emails/fromPublication.ts b/emails/fromPublication.ts
index 555ecb68..5000cca6 100644
--- a/emails/fromPublication.ts
+++ b/emails/fromPublication.ts
@@ -41,6 +41,7 @@ export const resolveEmailTheme = (
     headingFont: getFontFamilyValue(getFontConfig(theme.headingFont)),
     bodyFont: getFontFamilyValue(getFontConfig(theme.bodyFont)),
     pageWidth: theme.pageWidth ?? defaultEmailTheme.pageWidth,
+    showPageBackground: theme.showPageBackground ?? false,
   };
 };
 
diff --git a/emails/shared.tsx b/emails/shared.tsx
index 1d4e78cd..0da0c3c9 100644
--- a/emails/shared.tsx
+++ b/emails/shared.tsx
@@ -13,6 +13,7 @@ export type EmailTheme = {
   // post at the same column width in their inbox as on the live page.
   // Default 624 mirrors `ThemeProvider.tsx`'s fallback.
   pageWidth: number;
+  showPageBackground: boolean;
 };
 
 export const defaultEmailTheme: EmailTheme = {
@@ -24,6 +25,7 @@ export const defaultEmailTheme: EmailTheme = {
   headingFont: "Georgia, serif",
   bodyFont: "Verdana, sans-serif",
   pageWidth: 624,
+  showPageBackground: true,
 };
 
 // Parse rgb()/rgba()/#hex into [r, g, b]. Returns black on parse failure —
@@ -76,13 +78,25 @@ export type ResolvedColors = {
   borderLight: string;
 };
 
-export const resolveColors = (theme: EmailTheme): ResolvedColors => ({
-  primary: theme.primary,
-  secondary: mixRgb(theme.primary, theme.pageBackground, 25),
-  tertiary: mixRgb(theme.primary, theme.pageBackground, 55),
-  border: mixRgb(theme.primary, theme.pageBackground, 75),
-  borderLight: mixRgb(theme.primary, theme.pageBackground, 85),
-});
+export const resolveColors = (theme: EmailTheme): ResolvedColors => {
+  // When the card background is hidden, the surface visible behind every
+  // block is the outer page bg, not the publication's pageBackground.
+  // Mix tints against that visible surface so block fills (e.g. the
+  // unsupported-block fallback) sit on a tone derived from what's
+  // actually behind them — mirroring `BaseThemeProvider`'s web behavior
+  // where `bgPage` collapses to `bgLeaflet` when showPageBackground is
+  // false.
+  const effectiveBg = theme.showPageBackground
+    ? theme.pageBackground
+    : theme.backgroundColor;
+  return {
+    primary: theme.primary,
+    secondary: mixRgb(theme.primary, effectiveBg, 25),
+    tertiary: mixRgb(theme.primary, effectiveBg, 55),
+    border: mixRgb(theme.primary, effectiveBg, 75),
+    borderLight: mixRgb(theme.primary, effectiveBg, 85),
+  };
+};
 
 // Postmark fetches `<img src>` and link `href` values verbatim from the
 // rendered HTML — relative paths break. Templates accept an `assetsBaseUrl`