serializeThemeToCssVars
Serializes a shop's resolved theme into the ordered list of CSS custom-property declarations the
storefront emits, so SSR and the admin live-preview compute the same output byte-for-byte. The
function is pure and isomorphic (no server-only, no I/O); callers resolve the shop and its
branding first.
Most groups emit diff-from-default — only when the resolved value differs from
— so a theme-less shop returns [] and the globals.css base renders unchanged. Page chrome
(--color-background / --color-foreground) has no globals.css base, so it is emitted at its
resolved value whenever branding resolves (matching the historical branding-<style> behavior) and
diff-from-default otherwise. When branding resolves, the four accent shades are emitted — either the
theme-pinned override or the runtime colord derivation of the base accent — followed by the legacy
--accent-* aliases. Every value passes ; a rejected value is skipped so the
platform default applies.
Signature
function serializeThemeToCssVars(theme: ResolvedShopTheme, branding: ThemeBranding): ThemeCssVar[];Parameters
| Name | Type | Description |
|---|---|---|
theme | ResolvedShopTheme | |
branding | ThemeBranding |
Returns
Ordered [cssVar, value] pairs (including blank/comment sentinels for SSR formatting), or
an empty array when no tenant override differs from the defaults.
Related
FeatureFlagService ReviewService ShopService FeatureFlagOption FeatureFlagRef ResolvedCartLineTokens ResolvedProductCardTokens ResolvedShopTheme