---
url: /api/formats/css/src.md
---
[pantoken-root](../../../index.md) / css

# css

Beta

`@pantoken/css` — emit Instructure design tokens as `@property`-typed CSS.

[toCss](functions/toCss.md) turns any token IR into CSS; [css](variables/css.md) is the ready-made `rebrand` stylesheet and
[leanCss](variables/leanCss.md) is a lean variant that drops the full `--instui-icon-*` set (the ~1,777 icon data-URIs
that dominate the sheet) for CDN/embed delivery — ~a sixth the size over the wire. Both carry the
elevation + focus-outline foundation (composite custom properties whose pure builders live in
`@pantoken/utils`), so a component sheet resolves its shadows and focus ring against the token sheet
alone. A DOM side-effect entry lives at `@pantoken/css/inject`; static files at
`@pantoken/css/style.css` and `@pantoken/css/style.lean.css`.

## Interfaces

* [CssSection](interfaces/CssSection.md)
* [ScopedCssOptions](interfaces/ScopedCssOptions.md)
* [MultiScopeCssOptions](interfaces/MultiScopeCssOptions.md)
* [ToCssOptions](interfaces/ToCssOptions.md)

## Type Aliases

* [Scheme](type-aliases/Scheme.md)
* [CssEmitTarget](type-aliases/CssEmitTarget.md)

## Variables

* [css](variables/css.md)
* [leanCss](variables/leanCss.md)
* [LAYERS](variables/LAYERS.md)
* [THEME_ATTR](variables/THEME_ATTR.md)
* [SCHEME_ATTR](variables/SCHEME_ATTR.md)
* [COLOR_ATTR](variables/COLOR_ATTR.md)
* [BOUNDARY_ATTR](variables/BOUNDARY_ATTR.md)
* [themeClass](variables/themeClass.md)
* [schemeClass](variables/schemeClass.md)
* [colorClass](variables/colorClass.md)
* [BOUNDARY_CLASS](variables/BOUNDARY_CLASS.md)

## Functions

* [buildCssFile](functions/buildCssFile.md)
* [layerOrderCss](functions/layerOrderCss.md)
* [propertiesCss](functions/propertiesCss.md)
* [scopedThemeCss](functions/scopedThemeCss.md)
* [scopedSchemeCss](functions/scopedSchemeCss.md)
* [schemesCss](functions/schemesCss.md)
* [multiScopeCss](functions/multiScopeCss.md)
* [lightBranch](functions/lightBranch.md)
* [darkBranch](functions/darkBranch.md)
* [schemeOverrideTokens](functions/schemeOverrideTokens.md)
* [themedTokens](functions/themedTokens.md)
* [toCss](functions/toCss.md)
* [themeScopeSelector](functions/themeScopeSelector.md)
* [schemeScopeSelector](functions/schemeScopeSelector.md)
* [themeScopeSelectors](functions/themeScopeSelectors.md)
* [schemeScopeSelectors](functions/schemeScopeSelectors.md)

## References

### default

Renames and re-exports [css](variables/css.md)