---
url: /api/formats/css/src/functions/multiScopeCss.md
---
[pantoken-root](../../../../index.md) / [formats/css/src](../index.md) / 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`](../interfaces/MultiScopeCssOptions.md)

## Returns

`string`

## Example

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

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