Skip to content

theme-tokens.ts#

View Markdown

Source

2 documented symbols. Read the signatures first, then expand each item for parameters, return types, and examples.

2 symbols 1 functions 1 types 2 parameters 1 returns

Reference#

typeThemeTokens = Record<string, string>Free-form --octc-* custom properties for themes that need more than the typed c…

Free-form --octc-* custom properties for themes that need more than the typed colors / fonts / layout fields.

Keys are written without the --octc- prefix, so "surface-glass" becomes --octc-surface-glass. This is the seam that keeps the two theme axes independent: a color package can restyle code-block line markers, brand accents, and surface textures purely through tokens, while a skin package lays out geometry against those same tokens without knowing any color.

Signature

export type ThemeTokens = Record<string, string>

View source

fntokensToCss(light: ThemeTokens, dark: ThemeTokens): stringRenders light and dark token records as the three selectors the SSG runtime swi…

Renders light and dark token records as the three selectors the SSG runtime switches between: an explicit [data-theme="dark"] opt-in, the OS prefers-color-scheme fallback, and the :root base.

Emitted after the typed color variables and before the theme's own css, so a token can override a typed color and raw css can override a token.

Signature

export function tokensToCss(light: ThemeTokens, dark: ThemeTokens): string

View source

Parameters

Returns

string

Last updated: