Skip to content

pantoken-root / formats/css/src / multiScopeCss

Function: multiScopeCss() ​

multiScopeCss(options): string

Beta

The complete multi-scope sheet: layer order, one set of @property registrations, a shared base block, a token block per theme, and the light/dark color-scheme pins.

Tokens are partitioned by whether their value actually varies across themes. Invariant tokens go in the shared base block once; varying tokens are repeated in full in every theme block. That second half is what makes nesting safe — a theme block that omitted a varying token would inherit the enclosing scope's value for it.

Parameters ​

options ​

MultiScopeCssOptions

Returns ​

string

Example ​

ts
import { multiScopeCss } from "@pantoken/css";

multiScopeCss({ themes: ["rebrand", "canvas"], defaultTheme: "rebrand" });