buildThemeCss
buildThemeCss(
props):string
Defined in: packages/core/src/fields/color/utils.ts:189
Builds the stylesheet text applying a theme document at a scope.
Values are written through verbatim — a color() field storing
oklch(60.5% 0.175 42) needs no conversion, because custom properties accept
any colour notation. .dark is assumed to sit on <html>, which is
:root, so the dark selector is a compound, never a descendant.
The two scopes form a specificity ladder that no injection order can upset:
site light :root (0,1,0) < site dark .dark (0,1,0, later) < admin light
:root:root (0,2,0) < admin dark .dark:root:root (0,3,0). Emit the site
theme once for the whole document and the admin theme from the admin route
only, and the admin block wins exactly where it renders.
Parameters
Section titled “Parameters”Input props.
"site" emits :root; "admin" emits :root:root.
Record<string, unknown>
The theme document — light/dark colour groups plus
root-level radius and fontFamily, i.e. the shape themeColorFields
stores.
Returns
Section titled “Returns”string
The stylesheet text, or "" when the theme sets nothing.
Example
Section titled “Example”const css = buildThemeCss({ theme, scope: "site" });// ":root {\n --background: oklch(96.1% 0 0);\n …\n}\n\n.dark {\n …\n}"