Function: createTheme()
createTheme(
__namedParameters?):ThemeBundle
Defined in: createTheme.ts:83
Creates a theme bundle with an optional alternate color mode.
The extends param is the idiomatic way to build on a built-in theme:
it inherits the base tokens and the dark-mode alternate automatically.
Parameters
| Parameter | Type | Description |
|---|---|---|
__namedParameters | { alternate?: ModeOverride | null; base?: ThemeTokensV2; baseMode?: "light" | "dark"; extends?: ThemeBundle; overrides?: { core?: { border?: { style?: { dashed?: string; dotted?: string; none?: string; solid?: string; }; width?: { default?: string; focused?: string; none?: string; selected?: string; }; }; breakpoint?: { 2xl?: string; lg?: string; md?: string; sm?: string; xl?: string; }; colors?: {[key: string]: { 0?: string; 100?: string; 1000?: string; 200?: string; 300?: string; 400?: string; 50?: string; 500?: string; 600?: string; 700?: string; 800?: string; 900?: string; } | undefined; brand?: { 0?: string; 100?: string; 1000?: string; 200?: string; 300?: string; 400?: string; 50?: string; 500?: string; 600?: string; 700?: string; 800?: string; 900?: string; }; neutral?: { 0?: string; 100?: string; 1000?: string; 200?: string; 300?: string; 400?: string; 50?: string; 500?: string; 600?: string; 700?: string; 800?: string; 900?: string; }; }; dataviz?: { opacity?: { context?: number; muted?: number; uncertainty?: number; }; pattern?: { 1?: string; 2?: string; 3?: string; 4?: string; 5?: string; 6?: string; }; shape?: { 1?: string; 2?: string; 3?: string; 4?: string; 5?: string; 6?: string; 7?: string; 8?: string; }; stroke?: { dashed?: string; dotted?: string; solid?: string; }; }; elevation?: { dark?: { 0?: string; 1?: string; 2?: string; 3?: string; 4?: string; }; level?: { 0?: string; 1?: string; 2?: string; 3?: string; 4?: string; }; }; font?: { family?: { mono?: string; sans?: string; serif?: string; }; leading?: { normal?: number; relaxed?: number; snug?: number; tight?: number; }; numeric?: { proportional?: string; tabular?: string; }; opticalSizing?: { auto?: string; none?: string; }; tracking?: { normal?: string; tight?: string; wide?: string; }; weight?: { bold?: number; medium?: number; regular?: number; semibold?: number; }; }; motion?: { duration?: { lg?: string; md?: string; none?: string; sm?: string; xl?: string; xs?: string; }; easing?: { enter?: string; exit?: string; linear?: string; standard?: string; }; }; opacity?: { 0?: number; 100?: number; 25?: number; 50?: number; 75?: number; }; radii?: { full?: string; lg?: string; md?: string; none?: string; sm?: string; xl?: string; }; size?: { behavior?: { auto?: string; fit?: string; full?: string; max?: string; min?: string; }; hit?: { coarse?: { default?: ...; min?: ...; prominent?: ...; }; fine?: { default?: ...; min?: ...; prominent?: ...; }; }; ramp?: { layout?: { 1?: ...; 2?: ...; 3?: ...; 4?: ...; 5?: ...; 6?: ...; }; ui?: { 1?: ...; 2?: ...; 3?: ...; 4?: ...; 5?: ...; 6?: ...; 7?: ...; 8?: ...; }; }; relative?: { em?: string; rem?: string; }; viewport?: { heightFull?: string; }; }; space?: { 0?: string; 1?: string; 12?: string; 16?: string; 2?: string; 3?: string; 4?: string; 6?: string; 8?: string; unit?: string; unitCq?: string; }; type?: { ramp?: { display?: { 1?: ...; 2?: ...; 3?: ...; 4?: ...; 5?: ...; 6?: ...; }; text?: { 1?: ...; 2?: ...; 3?: ...; 4?: ...; 5?: ...; 6?: ...; }; }; }; zIndex?: { level?: { 0?: number; 1?: number; 2?: number; 3?: number; 4?: number; }; }; }; semantic?: { border?: { divider?: { style?: `{${(...)}}`; width?: `{${(...)}}`; }; outline?: { control?: { style?: ...; width?: ...; }; surface?: { style?: ...; width?: ...; }; }; selected?: { style?: `{${(...)}}`; width?: `{${(...)}}`; }; }; colors?: { action?: { accent?: { background?: ...; border?: ...; text?: ...; }; muted?: { background?: ...; border?: ...; text?: ...; }; negative?: { background?: ...; border?: ...; text?: ...; }; primary?: { background?: ...; border?: ...; text?: ...; }; secondary?: { background?: ...; border?: ...; text?: ...; }; }; content?: { accent?: { background?: ...; border?: ...; text?: ...; }; caution?: { background?: ...; border?: ...; text?: ...; }; muted?: { background?: ...; border?: ...; text?: ...; }; negative?: { background?: ...; border?: ...; text?: ...; }; positive?: { background?: ...; border?: ...; text?: ...; }; primary?: { background?: ...; border?: ...; text?: ...; }; secondary?: { background?: ...; border?: ...; text?: ...; }; }; discovery?: { accent?: { background?: ...; border?: ...; text?: ...; }; muted?: { background?: ...; border?: ...; text?: ...; }; primary?: { background?: ...; border?: ...; text?: ...; }; secondary?: { background?: ...; border?: ...; text?: ...; }; }; feedback?: { caution?: { background?: ...; border?: ...; text?: ...; }; muted?: { background?: ...; border?: ...; text?: ...; }; negative?: { background?: ...; border?: ...; text?: ...; }; positive?: { background?: ...; border?: ...; text?: ...; }; primary?: { background?: ...; border?: ...; text?: ...; }; }; guidance?: { accent?: { background?: ...; border?: ...; text?: ...; }; caution?: { background?: ...; border?: ...; text?: ...; }; muted?: { background?: ...; border?: ...; text?: ...; }; primary?: { background?: ...; border?: ...; text?: ...; }; secondary?: { background?: ...; border?: ...; text?: ...; }; }; input?: { caution?: { background?: ...; border?: ...; text?: ...; }; muted?: { background?: ...; border?: ...; text?: ...; }; negative?: { background?: ...; border?: ...; text?: ...; }; positive?: { background?: ...; border?: ...; text?: ...; }; primary?: { background?: ...; border?: ...; text?: ...; }; secondary?: { background?: ...; border?: ...; text?: ...; }; }; navigation?: { accent?: { background?: ...; border?: ...; text?: ...; }; muted?: { background?: ...; border?: ...; text?: ...; }; primary?: { background?: ...; border?: ...; text?: ...; }; secondary?: { background?: ...; border?: ...; text?: ...; }; }; }; dataviz?: { color?: { reference?: { baseline?: ...; target?: ...; }; scale?: { diverging?: ...; sequential?: ...; }; series?: { 1?: ...; 2?: ...; 3?: ...; 4?: ...; 5?: ...; 6?: ...; 7?: ...; 8?: ...; }; state?: { highlight?: ...; muted?: ...; selected?: ...; }; status?: { missing?: ...; not-applicable?: ...; suppressed?: ...; }; }; encoding?: { opacity?: { context?: ...; muted?: ...; uncertainty?: ...; }; pattern?: { series?: ...; }; shape?: { series?: ...; }; stroke?: { forecast?: ...; reference?: ...; uncertainty?: ...; }; }; geo?: { context?: { boundary?: ...; label?: ...; muted?: ...; }; state?: { focus?: ...; selection?: ...; }; }; }; elevation?: { surface?: { blocking?: `{${(...)}}`; flat?: `{${(...)}}`; overlay?: `{${(...)}}`; raised?: `{${(...)}}`; }; }; focus?: { ring?: { style?: `{${(...)}}`; width?: `{${(...)}}`; }; }; motion?: { decorative?: { duration?: `{${(...)}}`; easing?: `{${(...)}}`; }; emphasis?: { duration?: `{${(...)}}`; easing?: `{${(...)}}`; }; feedback?: { duration?: `{${(...)}}`; easing?: `{${(...)}}`; }; transition?: { enter?: { duration?: ...; easing?: ...; }; exit?: { duration?: ...; easing?: ...; }; }; }; opacity?: { disabledMedia?: `{${string}}`; loading?: `{${string}}`; scrim?: `{${string}}`; }; radii?: { control?: `{${string}}`; round?: `{${string}}`; surface?: `{${string}}`; }; sizing?: { hit?: { default?: `{${(...)}}`; min?: `{${(...)}}`; prominent?: `{${(...)}}`; }; icon?: { lg?: `{${(...)}}`; md?: `{${(...)}}`; sm?: `{${(...)}}`; }; identity?: { lg?: `{${(...)}}`; md?: `{${(...)}}`; sm?: `{${(...)}}`; xl?: `{${(...)}}`; }; measure?: { reading?: string; }; surface?: { maxWidth?: `{${(...)}}`; }; viewport?: { height?: { full?: ...; }; }; }; spacing?: { gap?: { inline?: { lg?: ...; md?: ...; sm?: ...; xs?: ...; }; stack?: { lg?: ...; md?: ...; sm?: ...; xl?: ...; xs?: ...; }; }; gutter?: { page?: string; section?: string; }; inset?: { control?: { lg?: ...; md?: ...; sm?: ...; }; surface?: { lg?: ...; md?: ...; sm?: ...; }; }; separation?: { interactive?: { min?: ...; }; }; }; text?: { body?: { lg?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; md?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; sm?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; }; code?: { md?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; sm?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; }; display?: { lg?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; md?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; sm?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; }; headline?: { lg?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; md?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; sm?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; }; label?: { lg?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; md?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; sm?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; }; title?: { lg?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; md?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; sm?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; }; }; zIndex?: { layer?: { base?: `{${(...)}}`; blocking?: `{${(...)}}`; overlay?: `{${(...)}}`; sticky?: `{${(...)}}`; transient?: `{${(...)}}`; }; }; }; }; } | - |
__namedParameters.alternate? | ModeOverride | null | Semantic remapping overrides for the opposite mode. Defaults to darkAlternate when not provided (and no extends). Pass null to opt out of any alternate (single-mode theme). |
__namedParameters.base? | ThemeTokensV2 | Base theme to extend. Defaults to extends.base or baseTheme. |
__namedParameters.baseMode? | "light" | "dark" | Which mode the base represents. Defaults to extends.baseMode or 'light'. |
__namedParameters.extends? | ThemeBundle | Parent bundle to inherit from. base, baseMode, and alternate all default to the parent's values — including dark-mode inheritance. extends is a reserved word in JS — destructured as parentBundle in the implementation. |
__namedParameters.overrides? | { core?: { border?: { style?: { dashed?: string; dotted?: string; none?: string; solid?: string; }; width?: { default?: string; focused?: string; none?: string; selected?: string; }; }; breakpoint?: { 2xl?: string; lg?: string; md?: string; sm?: string; xl?: string; }; colors?: {[key: string]: { 0?: string; 100?: string; 1000?: string; 200?: string; 300?: string; 400?: string; 50?: string; 500?: string; 600?: string; 700?: string; 800?: string; 900?: string; } | undefined; brand?: { 0?: string; 100?: string; 1000?: string; 200?: string; 300?: string; 400?: string; 50?: string; 500?: string; 600?: string; 700?: string; 800?: string; 900?: string; }; neutral?: { 0?: string; 100?: string; 1000?: string; 200?: string; 300?: string; 400?: string; 50?: string; 500?: string; 600?: string; 700?: string; 800?: string; 900?: string; }; }; dataviz?: { opacity?: { context?: number; muted?: number; uncertainty?: number; }; pattern?: { 1?: string; 2?: string; 3?: string; 4?: string; 5?: string; 6?: string; }; shape?: { 1?: string; 2?: string; 3?: string; 4?: string; 5?: string; 6?: string; 7?: string; 8?: string; }; stroke?: { dashed?: string; dotted?: string; solid?: string; }; }; elevation?: { dark?: { 0?: string; 1?: string; 2?: string; 3?: string; 4?: string; }; level?: { 0?: string; 1?: string; 2?: string; 3?: string; 4?: string; }; }; font?: { family?: { mono?: string; sans?: string; serif?: string; }; leading?: { normal?: number; relaxed?: number; snug?: number; tight?: number; }; numeric?: { proportional?: string; tabular?: string; }; opticalSizing?: { auto?: string; none?: string; }; tracking?: { normal?: string; tight?: string; wide?: string; }; weight?: { bold?: number; medium?: number; regular?: number; semibold?: number; }; }; motion?: { duration?: { lg?: string; md?: string; none?: string; sm?: string; xl?: string; xs?: string; }; easing?: { enter?: string; exit?: string; linear?: string; standard?: string; }; }; opacity?: { 0?: number; 100?: number; 25?: number; 50?: number; 75?: number; }; radii?: { full?: string; lg?: string; md?: string; none?: string; sm?: string; xl?: string; }; size?: { behavior?: { auto?: string; fit?: string; full?: string; max?: string; min?: string; }; hit?: { coarse?: { default?: ...; min?: ...; prominent?: ...; }; fine?: { default?: ...; min?: ...; prominent?: ...; }; }; ramp?: { layout?: { 1?: ...; 2?: ...; 3?: ...; 4?: ...; 5?: ...; 6?: ...; }; ui?: { 1?: ...; 2?: ...; 3?: ...; 4?: ...; 5?: ...; 6?: ...; 7?: ...; 8?: ...; }; }; relative?: { em?: string; rem?: string; }; viewport?: { heightFull?: string; }; }; space?: { 0?: string; 1?: string; 12?: string; 16?: string; 2?: string; 3?: string; 4?: string; 6?: string; 8?: string; unit?: string; unitCq?: string; }; type?: { ramp?: { display?: { 1?: ...; 2?: ...; 3?: ...; 4?: ...; 5?: ...; 6?: ...; }; text?: { 1?: ...; 2?: ...; 3?: ...; 4?: ...; 5?: ...; 6?: ...; }; }; }; zIndex?: { level?: { 0?: number; 1?: number; 2?: number; 3?: number; 4?: number; }; }; }; semantic?: { border?: { divider?: { style?: `{${(...)}}`; width?: `{${(...)}}`; }; outline?: { control?: { style?: ...; width?: ...; }; surface?: { style?: ...; width?: ...; }; }; selected?: { style?: `{${(...)}}`; width?: `{${(...)}}`; }; }; colors?: { action?: { accent?: { background?: ...; border?: ...; text?: ...; }; muted?: { background?: ...; border?: ...; text?: ...; }; negative?: { background?: ...; border?: ...; text?: ...; }; primary?: { background?: ...; border?: ...; text?: ...; }; secondary?: { background?: ...; border?: ...; text?: ...; }; }; content?: { accent?: { background?: ...; border?: ...; text?: ...; }; caution?: { background?: ...; border?: ...; text?: ...; }; muted?: { background?: ...; border?: ...; text?: ...; }; negative?: { background?: ...; border?: ...; text?: ...; }; positive?: { background?: ...; border?: ...; text?: ...; }; primary?: { background?: ...; border?: ...; text?: ...; }; secondary?: { background?: ...; border?: ...; text?: ...; }; }; discovery?: { accent?: { background?: ...; border?: ...; text?: ...; }; muted?: { background?: ...; border?: ...; text?: ...; }; primary?: { background?: ...; border?: ...; text?: ...; }; secondary?: { background?: ...; border?: ...; text?: ...; }; }; feedback?: { caution?: { background?: ...; border?: ...; text?: ...; }; muted?: { background?: ...; border?: ...; text?: ...; }; negative?: { background?: ...; border?: ...; text?: ...; }; positive?: { background?: ...; border?: ...; text?: ...; }; primary?: { background?: ...; border?: ...; text?: ...; }; }; guidance?: { accent?: { background?: ...; border?: ...; text?: ...; }; caution?: { background?: ...; border?: ...; text?: ...; }; muted?: { background?: ...; border?: ...; text?: ...; }; primary?: { background?: ...; border?: ...; text?: ...; }; secondary?: { background?: ...; border?: ...; text?: ...; }; }; input?: { caution?: { background?: ...; border?: ...; text?: ...; }; muted?: { background?: ...; border?: ...; text?: ...; }; negative?: { background?: ...; border?: ...; text?: ...; }; positive?: { background?: ...; border?: ...; text?: ...; }; primary?: { background?: ...; border?: ...; text?: ...; }; secondary?: { background?: ...; border?: ...; text?: ...; }; }; navigation?: { accent?: { background?: ...; border?: ...; text?: ...; }; muted?: { background?: ...; border?: ...; text?: ...; }; primary?: { background?: ...; border?: ...; text?: ...; }; secondary?: { background?: ...; border?: ...; text?: ...; }; }; }; dataviz?: { color?: { reference?: { baseline?: ...; target?: ...; }; scale?: { diverging?: ...; sequential?: ...; }; series?: { 1?: ...; 2?: ...; 3?: ...; 4?: ...; 5?: ...; 6?: ...; 7?: ...; 8?: ...; }; state?: { highlight?: ...; muted?: ...; selected?: ...; }; status?: { missing?: ...; not-applicable?: ...; suppressed?: ...; }; }; encoding?: { opacity?: { context?: ...; muted?: ...; uncertainty?: ...; }; pattern?: { series?: ...; }; shape?: { series?: ...; }; stroke?: { forecast?: ...; reference?: ...; uncertainty?: ...; }; }; geo?: { context?: { boundary?: ...; label?: ...; muted?: ...; }; state?: { focus?: ...; selection?: ...; }; }; }; elevation?: { surface?: { blocking?: `{${(...)}}`; flat?: `{${(...)}}`; overlay?: `{${(...)}}`; raised?: `{${(...)}}`; }; }; focus?: { ring?: { style?: `{${(...)}}`; width?: `{${(...)}}`; }; }; motion?: { decorative?: { duration?: `{${(...)}}`; easing?: `{${(...)}}`; }; emphasis?: { duration?: `{${(...)}}`; easing?: `{${(...)}}`; }; feedback?: { duration?: `{${(...)}}`; easing?: `{${(...)}}`; }; transition?: { enter?: { duration?: ...; easing?: ...; }; exit?: { duration?: ...; easing?: ...; }; }; }; opacity?: { disabledMedia?: `{${string}}`; loading?: `{${string}}`; scrim?: `{${string}}`; }; radii?: { control?: `{${string}}`; round?: `{${string}}`; surface?: `{${string}}`; }; sizing?: { hit?: { default?: `{${(...)}}`; min?: `{${(...)}}`; prominent?: `{${(...)}}`; }; icon?: { lg?: `{${(...)}}`; md?: `{${(...)}}`; sm?: `{${(...)}}`; }; identity?: { lg?: `{${(...)}}`; md?: `{${(...)}}`; sm?: `{${(...)}}`; xl?: `{${(...)}}`; }; measure?: { reading?: string; }; surface?: { maxWidth?: `{${(...)}}`; }; viewport?: { height?: { full?: ...; }; }; }; spacing?: { gap?: { inline?: { lg?: ...; md?: ...; sm?: ...; xs?: ...; }; stack?: { lg?: ...; md?: ...; sm?: ...; xl?: ...; xs?: ...; }; }; gutter?: { page?: string; section?: string; }; inset?: { control?: { lg?: ...; md?: ...; sm?: ...; }; surface?: { lg?: ...; md?: ...; sm?: ...; }; }; separation?: { interactive?: { min?: ...; }; }; }; text?: { body?: { lg?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; md?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; sm?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; }; code?: { md?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; sm?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; }; display?: { lg?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; md?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; sm?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; }; headline?: { lg?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; md?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; sm?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; }; label?: { lg?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; md?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; sm?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; }; title?: { lg?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; md?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; sm?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; }; }; zIndex?: { layer?: { base?: `{${(...)}}`; blocking?: `{${(...)}}`; overlay?: `{${(...)}}`; sticky?: `{${(...)}}`; transient?: `{${(...)}}`; }; }; }; } | Brand overrides applied to the base theme. |
__namedParameters.overrides.core? | { border?: { style?: { dashed?: string; dotted?: string; none?: string; solid?: string; }; width?: { default?: string; focused?: string; none?: string; selected?: string; }; }; breakpoint?: { 2xl?: string; lg?: string; md?: string; sm?: string; xl?: string; }; colors?: {[key: string]: { 0?: string; 100?: string; 1000?: string; 200?: string; 300?: string; 400?: string; 50?: string; 500?: string; 600?: string; 700?: string; 800?: string; 900?: string; } | undefined; brand?: { 0?: string; 100?: string; 1000?: string; 200?: string; 300?: string; 400?: string; 50?: string; 500?: string; 600?: string; 700?: string; 800?: string; 900?: string; }; neutral?: { 0?: string; 100?: string; 1000?: string; 200?: string; 300?: string; 400?: string; 50?: string; 500?: string; 600?: string; 700?: string; 800?: string; 900?: string; }; }; dataviz?: { opacity?: { context?: number; muted?: number; uncertainty?: number; }; pattern?: { 1?: string; 2?: string; 3?: string; 4?: string; 5?: string; 6?: string; }; shape?: { 1?: string; 2?: string; 3?: string; 4?: string; 5?: string; 6?: string; 7?: string; 8?: string; }; stroke?: { dashed?: string; dotted?: string; solid?: string; }; }; elevation?: { dark?: { 0?: string; 1?: string; 2?: string; 3?: string; 4?: string; }; level?: { 0?: string; 1?: string; 2?: string; 3?: string; 4?: string; }; }; font?: { family?: { mono?: string; sans?: string; serif?: string; }; leading?: { normal?: number; relaxed?: number; snug?: number; tight?: number; }; numeric?: { proportional?: string; tabular?: string; }; opticalSizing?: { auto?: string; none?: string; }; tracking?: { normal?: string; tight?: string; wide?: string; }; weight?: { bold?: number; medium?: number; regular?: number; semibold?: number; }; }; motion?: { duration?: { lg?: string; md?: string; none?: string; sm?: string; xl?: string; xs?: string; }; easing?: { enter?: string; exit?: string; linear?: string; standard?: string; }; }; opacity?: { 0?: number; 100?: number; 25?: number; 50?: number; 75?: number; }; radii?: { full?: string; lg?: string; md?: string; none?: string; sm?: string; xl?: string; }; size?: { behavior?: { auto?: string; fit?: string; full?: string; max?: string; min?: string; }; hit?: { coarse?: { default?: ...; min?: ...; prominent?: ...; }; fine?: { default?: ...; min?: ...; prominent?: ...; }; }; ramp?: { layout?: { 1?: ...; 2?: ...; 3?: ...; 4?: ...; 5?: ...; 6?: ...; }; ui?: { 1?: ...; 2?: ...; 3?: ...; 4?: ...; 5?: ...; 6?: ...; 7?: ...; 8?: ...; }; }; relative?: { em?: string; rem?: string; }; viewport?: { heightFull?: string; }; }; space?: { 0?: string; 1?: string; 12?: string; 16?: string; 2?: string; 3?: string; 4?: string; 6?: string; 8?: string; unit?: string; unitCq?: string; }; type?: { ramp?: { display?: { 1?: ...; 2?: ...; 3?: ...; 4?: ...; 5?: ...; 6?: ...; }; text?: { 1?: ...; 2?: ...; 3?: ...; 4?: ...; 5?: ...; 6?: ...; }; }; }; zIndex?: { level?: { 0?: number; 1?: number; 2?: number; 3?: number; 4?: number; }; }; } | - |
__namedParameters.overrides.core.border? | { style?: { dashed?: string; dotted?: string; none?: string; solid?: string; }; width?: { default?: string; focused?: string; none?: string; selected?: string; }; } | - |
__namedParameters.overrides.core.border.style? | { dashed?: string; dotted?: string; none?: string; solid?: string; } | - |
__namedParameters.overrides.core.border.style.dashed? | string | - |
__namedParameters.overrides.core.border.style.dotted? | string | - |
__namedParameters.overrides.core.border.style.none? | string | - |
__namedParameters.overrides.core.border.style.solid? | string | - |
__namedParameters.overrides.core.border.width? | { default?: string; focused?: string; none?: string; selected?: string; } | - |
__namedParameters.overrides.core.border.width.default? | string | - |
__namedParameters.overrides.core.border.width.focused? | string | - |
__namedParameters.overrides.core.border.width.none? | string | - |
__namedParameters.overrides.core.border.width.selected? | string | - |
__namedParameters.overrides.core.breakpoint? | { 2xl?: string; lg?: string; md?: string; sm?: string; xl?: string; } | Viewport thresholds. Core-only — no semantic layer. |
__namedParameters.overrides.core.breakpoint.2xl? | string | - |
__namedParameters.overrides.core.breakpoint.lg? | string | - |
__namedParameters.overrides.core.breakpoint.md? | string | - |
__namedParameters.overrides.core.breakpoint.sm? | string | - |
__namedParameters.overrides.core.breakpoint.xl? | string | - |
__namedParameters.overrides.core.colors? | {[key: string]: { 0?: string; 100?: string; 1000?: string; 200?: string; 300?: string; 400?: string; 50?: string; 500?: string; 600?: string; 700?: string; 800?: string; 900?: string; } | undefined; brand?: { 0?: string; 100?: string; 1000?: string; 200?: string; 300?: string; 400?: string; 50?: string; 500?: string; 600?: string; 700?: string; 800?: string; 900?: string; }; neutral?: { 0?: string; 100?: string; 1000?: string; 200?: string; 300?: string; 400?: string; 50?: string; 500?: string; 600?: string; 700?: string; 800?: string; 900?: string; }; } | - |
__namedParameters.overrides.core.colors.brand? | { 0?: string; 100?: string; 1000?: string; 200?: string; 300?: string; 400?: string; 50?: string; 500?: string; 600?: string; 700?: string; 800?: string; 900?: string; } | Primary brand identity color scale. |
__namedParameters.overrides.core.colors.brand.0? | string | - |
__namedParameters.overrides.core.colors.brand.100? | string | - |
__namedParameters.overrides.core.colors.brand.1000? | string | - |
__namedParameters.overrides.core.colors.brand.200? | string | - |
__namedParameters.overrides.core.colors.brand.300? | string | - |
__namedParameters.overrides.core.colors.brand.400? | string | - |
__namedParameters.overrides.core.colors.brand.50? | string | - |
__namedParameters.overrides.core.colors.brand.500? | string | - |
__namedParameters.overrides.core.colors.brand.600? | string | - |
__namedParameters.overrides.core.colors.brand.700? | string | - |
__namedParameters.overrides.core.colors.brand.800? | string | - |
__namedParameters.overrides.core.colors.brand.900? | string | - |
__namedParameters.overrides.core.colors.neutral? | { 0?: string; 100?: string; 1000?: string; 200?: string; 300?: string; 400?: string; 50?: string; 500?: string; 600?: string; 700?: string; 800?: string; 900?: string; } | Zero-saturation anchor scale (greyscale/slate). Provides surfaces, text contrast, dividers, and subdued UI. Named neutral by convention — not a semantic role, purely a palette family. Use step 0 for white-end and step 1000 for black-end. |
__namedParameters.overrides.core.colors.neutral.0? | string | - |
__namedParameters.overrides.core.colors.neutral.100? | string | - |
__namedParameters.overrides.core.colors.neutral.1000? | string | - |
__namedParameters.overrides.core.colors.neutral.200? | string | - |
__namedParameters.overrides.core.colors.neutral.300? | string | - |
__namedParameters.overrides.core.colors.neutral.400? | string | - |
__namedParameters.overrides.core.colors.neutral.50? | string | - |
__namedParameters.overrides.core.colors.neutral.500? | string | - |
__namedParameters.overrides.core.colors.neutral.600? | string | - |
__namedParameters.overrides.core.colors.neutral.700? | string | - |
__namedParameters.overrides.core.colors.neutral.800? | string | - |
__namedParameters.overrides.core.colors.neutral.900? | string | - |
__namedParameters.overrides.core.dataviz? | { opacity?: { context?: number; muted?: number; uncertainty?: number; }; pattern?: { 1?: string; 2?: string; 3?: string; 4?: string; 5?: string; 6?: string; }; shape?: { 1?: string; 2?: string; 3?: string; 4?: string; 5?: string; 6?: string; 7?: string; 8?: string; }; stroke?: { dashed?: string; dotted?: string; solid?: string; }; } | Data Visualization extension — analytical color palettes and non-color encoding primitives. Optional: omit when the theme does not support dataviz. |
__namedParameters.overrides.core.dataviz.opacity? | { context?: number; muted?: number; uncertainty?: number; } | - |
__namedParameters.overrides.core.dataviz.opacity.context? | number | Geographic/spatial context reduction behind overlays. |
__namedParameters.overrides.core.dataviz.opacity.muted? | number | De-emphasis of non-highlighted data marks. |
__namedParameters.overrides.core.dataviz.opacity.uncertainty? | number | Visual signal of estimated or uncertain data. |
__namedParameters.overrides.core.dataviz.pattern? | { 1?: string; 2?: string; 3?: string; 4?: string; 5?: string; 6?: string; } | - |
__namedParameters.overrides.core.dataviz.pattern.1? | string | - |
__namedParameters.overrides.core.dataviz.pattern.2? | string | - |
__namedParameters.overrides.core.dataviz.pattern.3? | string | - |
__namedParameters.overrides.core.dataviz.pattern.4? | string | - |
__namedParameters.overrides.core.dataviz.pattern.5? | string | - |
__namedParameters.overrides.core.dataviz.pattern.6? | string | - |
__namedParameters.overrides.core.dataviz.shape? | { 1?: string; 2?: string; 3?: string; 4?: string; 5?: string; 6?: string; 7?: string; 8?: string; } | - |
__namedParameters.overrides.core.dataviz.shape.1? | string | - |
__namedParameters.overrides.core.dataviz.shape.2? | string | - |
__namedParameters.overrides.core.dataviz.shape.3? | string | - |
__namedParameters.overrides.core.dataviz.shape.4? | string | - |
__namedParameters.overrides.core.dataviz.shape.5? | string | - |
__namedParameters.overrides.core.dataviz.shape.6? | string | - |
__namedParameters.overrides.core.dataviz.shape.7? | string | - |
__namedParameters.overrides.core.dataviz.shape.8? | string | - |
__namedParameters.overrides.core.dataviz.stroke? | { dashed?: string; dotted?: string; solid?: string; } | - |
__namedParameters.overrides.core.dataviz.stroke.dashed? | string | - |
__namedParameters.overrides.core.dataviz.stroke.dotted? | string | - |
__namedParameters.overrides.core.dataviz.stroke.solid? | string | - |
__namedParameters.overrides.core.elevation? | { dark?: { 0?: string; 1?: string; 2?: string; 3?: string; 4?: string; }; level?: { 0?: string; 1?: string; 2?: string; 3?: string; 4?: string; }; } | - |
__namedParameters.overrides.core.elevation.dark? | { 0?: string; 1?: string; 2?: string; 3?: string; 4?: string; } | Dark-optimized shadow recipes. Themes that support a dark mode enrich core with these recipes, so that the dark semantic alternate can remap to them without mutating the base level tokens. |
__namedParameters.overrides.core.elevation.dark.0? | string | - |
__namedParameters.overrides.core.elevation.dark.1? | string | - |
__namedParameters.overrides.core.elevation.dark.2? | string | - |
__namedParameters.overrides.core.elevation.dark.3? | string | - |
__namedParameters.overrides.core.elevation.dark.4? | string | - |
__namedParameters.overrides.core.elevation.level? | { 0?: string; 1?: string; 2?: string; 3?: string; 4?: string; } | Base shadow recipes (used by light mode by default). |
__namedParameters.overrides.core.elevation.level.0? | string | - |
__namedParameters.overrides.core.elevation.level.1? | string | - |
__namedParameters.overrides.core.elevation.level.2? | string | - |
__namedParameters.overrides.core.elevation.level.3? | string | - |
__namedParameters.overrides.core.elevation.level.4? | string | - |
__namedParameters.overrides.core.font? | { family?: { mono?: string; sans?: string; serif?: string; }; leading?: { normal?: number; relaxed?: number; snug?: number; tight?: number; }; numeric?: { proportional?: string; tabular?: string; }; opticalSizing?: { auto?: string; none?: string; }; tracking?: { normal?: string; tight?: string; wide?: string; }; weight?: { bold?: number; medium?: number; regular?: number; semibold?: number; }; } | - |
__namedParameters.overrides.core.font.family? | { mono?: string; sans?: string; serif?: string; } | - |
__namedParameters.overrides.core.font.family.mono? | string | - |
__namedParameters.overrides.core.font.family.sans? | string | - |
__namedParameters.overrides.core.font.family.serif? | string | - |
__namedParameters.overrides.core.font.leading? | { normal?: number; relaxed?: number; snug?: number; tight?: number; } | - |
__namedParameters.overrides.core.font.leading.normal? | number | - |
__namedParameters.overrides.core.font.leading.relaxed? | number | - |
__namedParameters.overrides.core.font.leading.snug? | number | - |
__namedParameters.overrides.core.font.leading.tight? | number | - |
__namedParameters.overrides.core.font.numeric? | { proportional?: string; tabular?: string; } | - |
__namedParameters.overrides.core.font.numeric.proportional? | string | - |
__namedParameters.overrides.core.font.numeric.tabular? | string | - |
__namedParameters.overrides.core.font.opticalSizing? | { auto?: string; none?: string; } | - |
__namedParameters.overrides.core.font.opticalSizing.auto? | string | - |
__namedParameters.overrides.core.font.opticalSizing.none? | string | - |
__namedParameters.overrides.core.font.tracking? | { normal?: string; tight?: string; wide?: string; } | - |
__namedParameters.overrides.core.font.tracking.normal? | string | - |
__namedParameters.overrides.core.font.tracking.tight? | string | - |
__namedParameters.overrides.core.font.tracking.wide? | string | - |
__namedParameters.overrides.core.font.weight? | { bold?: number; medium?: number; regular?: number; semibold?: number; } | - |
__namedParameters.overrides.core.font.weight.bold? | number | - |
__namedParameters.overrides.core.font.weight.medium? | number | - |
__namedParameters.overrides.core.font.weight.regular? | number | - |
__namedParameters.overrides.core.font.weight.semibold? | number | - |
__namedParameters.overrides.core.motion? | { duration?: { lg?: string; md?: string; none?: string; sm?: string; xl?: string; xs?: string; }; easing?: { enter?: string; exit?: string; linear?: string; standard?: string; }; } | - |
__namedParameters.overrides.core.motion.duration? | { lg?: string; md?: string; none?: string; sm?: string; xl?: string; xs?: string; } | - |
__namedParameters.overrides.core.motion.duration.lg? | string | - |
__namedParameters.overrides.core.motion.duration.md? | string | - |
__namedParameters.overrides.core.motion.duration.none? | string | - |
__namedParameters.overrides.core.motion.duration.sm? | string | - |
__namedParameters.overrides.core.motion.duration.xl? | string | - |
__namedParameters.overrides.core.motion.duration.xs? | string | - |
__namedParameters.overrides.core.motion.easing? | { enter?: string; exit?: string; linear?: string; standard?: string; } | - |
__namedParameters.overrides.core.motion.easing.enter? | string | - |
__namedParameters.overrides.core.motion.easing.exit? | string | - |
__namedParameters.overrides.core.motion.easing.linear? | string | - |
__namedParameters.overrides.core.motion.easing.standard? | string | - |
__namedParameters.overrides.core.opacity? | { 0?: number; 100?: number; 25?: number; 50?: number; 75?: number; } | - |
__namedParameters.overrides.core.opacity.0? | number | - |
__namedParameters.overrides.core.opacity.100? | number | - |
__namedParameters.overrides.core.opacity.25? | number | - |
__namedParameters.overrides.core.opacity.50? | number | - |
__namedParameters.overrides.core.opacity.75? | number | - |
__namedParameters.overrides.core.radii? | { full?: string; lg?: string; md?: string; none?: string; sm?: string; xl?: string; } | - |
__namedParameters.overrides.core.radii.full? | string | - |
__namedParameters.overrides.core.radii.lg? | string | - |
__namedParameters.overrides.core.radii.md? | string | - |
__namedParameters.overrides.core.radii.none? | string | - |
__namedParameters.overrides.core.radii.sm? | string | - |
__namedParameters.overrides.core.radii.xl? | string | - |
__namedParameters.overrides.core.size? | { behavior?: { auto?: string; fit?: string; full?: string; max?: string; min?: string; }; hit?: { coarse?: { default?: ...; min?: ...; prominent?: ...; }; fine?: { default?: ...; min?: ...; prominent?: ...; }; }; ramp?: { layout?: { 1?: ...; 2?: ...; 3?: ...; 4?: ...; 5?: ...; 6?: ...; }; ui?: { 1?: ...; 2?: ...; 3?: ...; 4?: ...; 5?: ...; 6?: ...; 7?: ...; 8?: ...; }; }; relative?: { em?: string; rem?: string; }; viewport?: { heightFull?: string; }; } | - |
__namedParameters.overrides.core.size.behavior? | { auto?: string; fit?: string; full?: string; max?: string; min?: string; } | - |
__namedParameters.overrides.core.size.behavior.auto? | string | - |
__namedParameters.overrides.core.size.behavior.fit? | string | - |
__namedParameters.overrides.core.size.behavior.full? | string | - |
__namedParameters.overrides.core.size.behavior.max? | string | - |
__namedParameters.overrides.core.size.behavior.min? | string | - |
__namedParameters.overrides.core.size.hit? | { coarse?: { default?: ...; min?: ...; prominent?: ...; }; fine?: { default?: ...; min?: ...; prominent?: ...; }; } | - |
__namedParameters.overrides.core.size.hit.coarse? | { default?: ...; min?: ...; prominent?: ...; } | Coarse pointer (touch) hit targets |
__namedParameters.overrides.core.size.hit.coarse.default? | ... | - |
__namedParameters.overrides.core.size.hit.coarse.min? | ... | - |
__namedParameters.overrides.core.size.hit.coarse.prominent? | ... | - |
__namedParameters.overrides.core.size.hit.fine? | { default?: ...; min?: ...; prominent?: ...; } | Fine pointer (mouse/trackpad) hit targets |
__namedParameters.overrides.core.size.hit.fine.default? | ... | - |
__namedParameters.overrides.core.size.hit.fine.min? | ... | - |
__namedParameters.overrides.core.size.hit.fine.prominent? | ... | - |
__namedParameters.overrides.core.size.ramp? | { layout?: { 1?: ...; 2?: ...; 3?: ...; 4?: ...; 5?: ...; 6?: ...; }; ui?: { 1?: ...; 2?: ...; 3?: ...; 4?: ...; 5?: ...; 6?: ...; 7?: ...; 8?: ...; }; } | - |
__namedParameters.overrides.core.size.ramp.layout? | { 1?: ...; 2?: ...; 3?: ...; 4?: ...; 5?: ...; 6?: ...; } | - |
__namedParameters.overrides.core.size.ramp.layout.1? | ... | - |
__namedParameters.overrides.core.size.ramp.layout.2? | ... | - |
__namedParameters.overrides.core.size.ramp.layout.3? | ... | - |
__namedParameters.overrides.core.size.ramp.layout.4? | ... | - |
__namedParameters.overrides.core.size.ramp.layout.5? | ... | - |
__namedParameters.overrides.core.size.ramp.layout.6? | ... | - |
__namedParameters.overrides.core.size.ramp.ui? | { 1?: ...; 2?: ...; 3?: ...; 4?: ...; 5?: ...; 6?: ...; 7?: ...; 8?: ...; } | - |
__namedParameters.overrides.core.size.ramp.ui.1? | ... | - |
__namedParameters.overrides.core.size.ramp.ui.2? | ... | - |
__namedParameters.overrides.core.size.ramp.ui.3? | ... | - |
__namedParameters.overrides.core.size.ramp.ui.4? | ... | - |
__namedParameters.overrides.core.size.ramp.ui.5? | ... | - |
__namedParameters.overrides.core.size.ramp.ui.6? | ... | - |
__namedParameters.overrides.core.size.ramp.ui.7? | ... | - |
__namedParameters.overrides.core.size.ramp.ui.8? | ... | - |
__namedParameters.overrides.core.size.relative? | { em?: string; rem?: string; } | - |
__namedParameters.overrides.core.size.relative.em? | string | - |
__namedParameters.overrides.core.size.relative.rem? | string | - |
__namedParameters.overrides.core.size.viewport? | { heightFull?: string; } | - |
__namedParameters.overrides.core.size.viewport.heightFull? | string | - |
__namedParameters.overrides.core.space? | { 0?: string; 1?: string; 12?: string; 16?: string; 2?: string; 3?: string; 4?: string; 6?: string; 8?: string; unit?: string; unitCq?: string; } | - |
__namedParameters.overrides.core.space.0? | string | - |
__namedParameters.overrides.core.space.1? | string | - |
__namedParameters.overrides.core.space.12? | string | - |
__namedParameters.overrides.core.space.16? | string | - |
__namedParameters.overrides.core.space.2? | string | - |
__namedParameters.overrides.core.space.3? | string | - |
__namedParameters.overrides.core.space.4? | string | - |
__namedParameters.overrides.core.space.6? | string | - |
__namedParameters.overrides.core.space.8? | string | - |
__namedParameters.overrides.core.space.unit? | string | Responsive engine — container-first clamp formula |
__namedParameters.overrides.core.space.unitCq? | string | Optional container-aware unit |
__namedParameters.overrides.core.type? | { ramp?: { display?: { 1?: ...; 2?: ...; 3?: ...; 4?: ...; 5?: ...; 6?: ...; }; text?: { 1?: ...; 2?: ...; 3?: ...; 4?: ...; 5?: ...; 6?: ...; }; }; } | - |
__namedParameters.overrides.core.type.ramp? | { display?: { 1?: ...; 2?: ...; 3?: ...; 4?: ...; 5?: ...; 6?: ...; }; text?: { 1?: ...; 2?: ...; 3?: ...; 4?: ...; 5?: ...; 6?: ...; }; } | - |
__namedParameters.overrides.core.type.ramp.display? | { 1?: ...; 2?: ...; 3?: ...; 4?: ...; 5?: ...; 6?: ...; } | Headings, titles, and high-hierarchy display text |
__namedParameters.overrides.core.type.ramp.display.1? | ... | - |
__namedParameters.overrides.core.type.ramp.display.2? | ... | - |
__namedParameters.overrides.core.type.ramp.display.3? | ... | - |
__namedParameters.overrides.core.type.ramp.display.4? | ... | - |
__namedParameters.overrides.core.type.ramp.display.5? | ... | - |
__namedParameters.overrides.core.type.ramp.display.6? | ... | - |
__namedParameters.overrides.core.type.ramp.text? | { 1?: ...; 2?: ...; 3?: ...; 4?: ...; 5?: ...; 6?: ...; } | Body text, labels, and dense UI typography |
__namedParameters.overrides.core.type.ramp.text.1? | ... | - |
__namedParameters.overrides.core.type.ramp.text.2? | ... | - |
__namedParameters.overrides.core.type.ramp.text.3? | ... | - |
__namedParameters.overrides.core.type.ramp.text.4? | ... | - |
__namedParameters.overrides.core.type.ramp.text.5? | ... | - |
__namedParameters.overrides.core.type.ramp.text.6? | ... | - |
__namedParameters.overrides.core.zIndex? | { level?: { 0?: number; 1?: number; 2?: number; 3?: number; 4?: number; }; } | - |
__namedParameters.overrides.core.zIndex.level? | { 0?: number; 1?: number; 2?: number; 3?: number; 4?: number; } | - |
__namedParameters.overrides.core.zIndex.level.0? | number | - |
__namedParameters.overrides.core.zIndex.level.1? | number | - |
__namedParameters.overrides.core.zIndex.level.2? | number | - |
__namedParameters.overrides.core.zIndex.level.3? | number | - |
__namedParameters.overrides.core.zIndex.level.4? | number | - |
__namedParameters.overrides.semantic? | { border?: { divider?: { style?: `{${(...)}}`; width?: `{${(...)}}`; }; outline?: { control?: { style?: ...; width?: ...; }; surface?: { style?: ...; width?: ...; }; }; selected?: { style?: `{${(...)}}`; width?: `{${(...)}}`; }; }; colors?: { action?: { accent?: { background?: ...; border?: ...; text?: ...; }; muted?: { background?: ...; border?: ...; text?: ...; }; negative?: { background?: ...; border?: ...; text?: ...; }; primary?: { background?: ...; border?: ...; text?: ...; }; secondary?: { background?: ...; border?: ...; text?: ...; }; }; content?: { accent?: { background?: ...; border?: ...; text?: ...; }; caution?: { background?: ...; border?: ...; text?: ...; }; muted?: { background?: ...; border?: ...; text?: ...; }; negative?: { background?: ...; border?: ...; text?: ...; }; positive?: { background?: ...; border?: ...; text?: ...; }; primary?: { background?: ...; border?: ...; text?: ...; }; secondary?: { background?: ...; border?: ...; text?: ...; }; }; discovery?: { accent?: { background?: ...; border?: ...; text?: ...; }; muted?: { background?: ...; border?: ...; text?: ...; }; primary?: { background?: ...; border?: ...; text?: ...; }; secondary?: { background?: ...; border?: ...; text?: ...; }; }; feedback?: { caution?: { background?: ...; border?: ...; text?: ...; }; muted?: { background?: ...; border?: ...; text?: ...; }; negative?: { background?: ...; border?: ...; text?: ...; }; positive?: { background?: ...; border?: ...; text?: ...; }; primary?: { background?: ...; border?: ...; text?: ...; }; }; guidance?: { accent?: { background?: ...; border?: ...; text?: ...; }; caution?: { background?: ...; border?: ...; text?: ...; }; muted?: { background?: ...; border?: ...; text?: ...; }; primary?: { background?: ...; border?: ...; text?: ...; }; secondary?: { background?: ...; border?: ...; text?: ...; }; }; input?: { caution?: { background?: ...; border?: ...; text?: ...; }; muted?: { background?: ...; border?: ...; text?: ...; }; negative?: { background?: ...; border?: ...; text?: ...; }; positive?: { background?: ...; border?: ...; text?: ...; }; primary?: { background?: ...; border?: ...; text?: ...; }; secondary?: { background?: ...; border?: ...; text?: ...; }; }; navigation?: { accent?: { background?: ...; border?: ...; text?: ...; }; muted?: { background?: ...; border?: ...; text?: ...; }; primary?: { background?: ...; border?: ...; text?: ...; }; secondary?: { background?: ...; border?: ...; text?: ...; }; }; }; dataviz?: { color?: { reference?: { baseline?: ...; target?: ...; }; scale?: { diverging?: ...; sequential?: ...; }; series?: { 1?: ...; 2?: ...; 3?: ...; 4?: ...; 5?: ...; 6?: ...; 7?: ...; 8?: ...; }; state?: { highlight?: ...; muted?: ...; selected?: ...; }; status?: { missing?: ...; not-applicable?: ...; suppressed?: ...; }; }; encoding?: { opacity?: { context?: ...; muted?: ...; uncertainty?: ...; }; pattern?: { series?: ...; }; shape?: { series?: ...; }; stroke?: { forecast?: ...; reference?: ...; uncertainty?: ...; }; }; geo?: { context?: { boundary?: ...; label?: ...; muted?: ...; }; state?: { focus?: ...; selection?: ...; }; }; }; elevation?: { surface?: { blocking?: `{${(...)}}`; flat?: `{${(...)}}`; overlay?: `{${(...)}}`; raised?: `{${(...)}}`; }; }; focus?: { ring?: { style?: `{${(...)}}`; width?: `{${(...)}}`; }; }; motion?: { decorative?: { duration?: `{${(...)}}`; easing?: `{${(...)}}`; }; emphasis?: { duration?: `{${(...)}}`; easing?: `{${(...)}}`; }; feedback?: { duration?: `{${(...)}}`; easing?: `{${(...)}}`; }; transition?: { enter?: { duration?: ...; easing?: ...; }; exit?: { duration?: ...; easing?: ...; }; }; }; opacity?: { disabledMedia?: `{${string}}`; loading?: `{${string}}`; scrim?: `{${string}}`; }; radii?: { control?: `{${string}}`; round?: `{${string}}`; surface?: `{${string}}`; }; sizing?: { hit?: { default?: `{${(...)}}`; min?: `{${(...)}}`; prominent?: `{${(...)}}`; }; icon?: { lg?: `{${(...)}}`; md?: `{${(...)}}`; sm?: `{${(...)}}`; }; identity?: { lg?: `{${(...)}}`; md?: `{${(...)}}`; sm?: `{${(...)}}`; xl?: `{${(...)}}`; }; measure?: { reading?: string; }; surface?: { maxWidth?: `{${(...)}}`; }; viewport?: { height?: { full?: ...; }; }; }; spacing?: { gap?: { inline?: { lg?: ...; md?: ...; sm?: ...; xs?: ...; }; stack?: { lg?: ...; md?: ...; sm?: ...; xl?: ...; xs?: ...; }; }; gutter?: { page?: string; section?: string; }; inset?: { control?: { lg?: ...; md?: ...; sm?: ...; }; surface?: { lg?: ...; md?: ...; sm?: ...; }; }; separation?: { interactive?: { min?: ...; }; }; }; text?: { body?: { lg?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; md?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; sm?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; }; code?: { md?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; sm?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; }; display?: { lg?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; md?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; sm?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; }; headline?: { lg?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; md?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; sm?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; }; label?: { lg?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; md?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; sm?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; }; title?: { lg?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; md?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; sm?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; }; }; zIndex?: { layer?: { base?: `{${(...)}}`; blocking?: `{${(...)}}`; overlay?: `{${(...)}}`; sticky?: `{${(...)}}`; transient?: `{${(...)}}`; }; }; } | - |
__namedParameters.overrides.semantic.border? | { divider?: { style?: `{${(...)}}`; width?: `{${(...)}}`; }; outline?: { control?: { style?: ...; width?: ...; }; surface?: { style?: ...; width?: ...; }; }; selected?: { style?: `{${(...)}}`; width?: `{${(...)}}`; }; } | - |
__namedParameters.overrides.semantic.border.divider? | { style?: `{${(...)}}`; width?: `{${(...)}}`; } | - |
__namedParameters.overrides.semantic.border.divider.style? | `{${(...)}}` | - |
__namedParameters.overrides.semantic.border.divider.width? | `{${(...)}}` | - |
__namedParameters.overrides.semantic.border.outline? | { control?: { style?: ...; width?: ...; }; surface?: { style?: ...; width?: ...; }; } | - |
__namedParameters.overrides.semantic.border.outline.control? | { style?: ...; width?: ...; } | - |
__namedParameters.overrides.semantic.border.outline.control.style? | ... | - |
__namedParameters.overrides.semantic.border.outline.control.width? | ... | - |
__namedParameters.overrides.semantic.border.outline.surface? | { style?: ...; width?: ...; } | - |
__namedParameters.overrides.semantic.border.outline.surface.style? | ... | - |
__namedParameters.overrides.semantic.border.outline.surface.width? | ... | - |
__namedParameters.overrides.semantic.border.selected? | { style?: `{${(...)}}`; width?: `{${(...)}}`; } | - |
__namedParameters.overrides.semantic.border.selected.style? | `{${(...)}}` | - |
__namedParameters.overrides.semantic.border.selected.width? | `{${(...)}}` | - |
__namedParameters.overrides.semantic.colors? | { action?: { accent?: { background?: ...; border?: ...; text?: ...; }; muted?: { background?: ...; border?: ...; text?: ...; }; negative?: { background?: ...; border?: ...; text?: ...; }; primary?: { background?: ...; border?: ...; text?: ...; }; secondary?: { background?: ...; border?: ...; text?: ...; }; }; content?: { accent?: { background?: ...; border?: ...; text?: ...; }; caution?: { background?: ...; border?: ...; text?: ...; }; muted?: { background?: ...; border?: ...; text?: ...; }; negative?: { background?: ...; border?: ...; text?: ...; }; positive?: { background?: ...; border?: ...; text?: ...; }; primary?: { background?: ...; border?: ...; text?: ...; }; secondary?: { background?: ...; border?: ...; text?: ...; }; }; discovery?: { accent?: { background?: ...; border?: ...; text?: ...; }; muted?: { background?: ...; border?: ...; text?: ...; }; primary?: { background?: ...; border?: ...; text?: ...; }; secondary?: { background?: ...; border?: ...; text?: ...; }; }; feedback?: { caution?: { background?: ...; border?: ...; text?: ...; }; muted?: { background?: ...; border?: ...; text?: ...; }; negative?: { background?: ...; border?: ...; text?: ...; }; positive?: { background?: ...; border?: ...; text?: ...; }; primary?: { background?: ...; border?: ...; text?: ...; }; }; guidance?: { accent?: { background?: ...; border?: ...; text?: ...; }; caution?: { background?: ...; border?: ...; text?: ...; }; muted?: { background?: ...; border?: ...; text?: ...; }; primary?: { background?: ...; border?: ...; text?: ...; }; secondary?: { background?: ...; border?: ...; text?: ...; }; }; input?: { caution?: { background?: ...; border?: ...; text?: ...; }; muted?: { background?: ...; border?: ...; text?: ...; }; negative?: { background?: ...; border?: ...; text?: ...; }; positive?: { background?: ...; border?: ...; text?: ...; }; primary?: { background?: ...; border?: ...; text?: ...; }; secondary?: { background?: ...; border?: ...; text?: ...; }; }; navigation?: { accent?: { background?: ...; border?: ...; text?: ...; }; muted?: { background?: ...; border?: ...; text?: ...; }; primary?: { background?: ...; border?: ...; text?: ...; }; secondary?: { background?: ...; border?: ...; text?: ...; }; }; } | - |
__namedParameters.overrides.semantic.colors.action? | { accent?: { background?: ...; border?: ...; text?: ...; }; muted?: { background?: ...; border?: ...; text?: ...; }; negative?: { background?: ...; border?: ...; text?: ...; }; primary?: { background?: ...; border?: ...; text?: ...; }; secondary?: { background?: ...; border?: ...; text?: ...; }; } | - |
__namedParameters.overrides.semantic.colors.action.accent? | { background?: ...; border?: ...; text?: ...; } | - |
__namedParameters.overrides.semantic.colors.action.accent.background? | ... | - |
__namedParameters.overrides.semantic.colors.action.accent.border? | ... | - |
__namedParameters.overrides.semantic.colors.action.accent.text? | ... | - |
__namedParameters.overrides.semantic.colors.action.muted? | { background?: ...; border?: ...; text?: ...; } | - |
__namedParameters.overrides.semantic.colors.action.muted.background? | ... | - |
__namedParameters.overrides.semantic.colors.action.muted.border? | ... | - |
__namedParameters.overrides.semantic.colors.action.muted.text? | ... | - |
__namedParameters.overrides.semantic.colors.action.negative? | { background?: ...; border?: ...; text?: ...; } | - |
__namedParameters.overrides.semantic.colors.action.negative.background? | ... | - |
__namedParameters.overrides.semantic.colors.action.negative.border? | ... | - |
__namedParameters.overrides.semantic.colors.action.negative.text? | ... | - |
__namedParameters.overrides.semantic.colors.action.primary? | { background?: ...; border?: ...; text?: ...; } | - |
__namedParameters.overrides.semantic.colors.action.primary.background? | ... | - |
__namedParameters.overrides.semantic.colors.action.primary.border? | ... | - |
__namedParameters.overrides.semantic.colors.action.primary.text? | ... | - |
__namedParameters.overrides.semantic.colors.action.secondary? | { background?: ...; border?: ...; text?: ...; } | - |
__namedParameters.overrides.semantic.colors.action.secondary.background? | ... | - |
__namedParameters.overrides.semantic.colors.action.secondary.border? | ... | - |
__namedParameters.overrides.semantic.colors.action.secondary.text? | ... | - |
__namedParameters.overrides.semantic.colors.content? | { accent?: { background?: ...; border?: ...; text?: ...; }; caution?: { background?: ...; border?: ...; text?: ...; }; muted?: { background?: ...; border?: ...; text?: ...; }; negative?: { background?: ...; border?: ...; text?: ...; }; positive?: { background?: ...; border?: ...; text?: ...; }; primary?: { background?: ...; border?: ...; text?: ...; }; secondary?: { background?: ...; border?: ...; text?: ...; }; } | - |
__namedParameters.overrides.semantic.colors.content.accent? | { background?: ...; border?: ...; text?: ...; } | - |
__namedParameters.overrides.semantic.colors.content.accent.background? | ... | - |
__namedParameters.overrides.semantic.colors.content.accent.border? | ... | - |
__namedParameters.overrides.semantic.colors.content.accent.text? | ... | - |
__namedParameters.overrides.semantic.colors.content.caution? | { background?: ...; border?: ...; text?: ...; } | - |
__namedParameters.overrides.semantic.colors.content.caution.background? | ... | - |
__namedParameters.overrides.semantic.colors.content.caution.border? | ... | - |
__namedParameters.overrides.semantic.colors.content.caution.text? | ... | - |
__namedParameters.overrides.semantic.colors.content.muted? | { background?: ...; border?: ...; text?: ...; } | - |
__namedParameters.overrides.semantic.colors.content.muted.background? | ... | - |
__namedParameters.overrides.semantic.colors.content.muted.border? | ... | - |
__namedParameters.overrides.semantic.colors.content.muted.text? | ... | - |
__namedParameters.overrides.semantic.colors.content.negative? | { background?: ...; border?: ...; text?: ...; } | - |
__namedParameters.overrides.semantic.colors.content.negative.background? | ... | - |
__namedParameters.overrides.semantic.colors.content.negative.border? | ... | - |
__namedParameters.overrides.semantic.colors.content.negative.text? | ... | - |
__namedParameters.overrides.semantic.colors.content.positive? | { background?: ...; border?: ...; text?: ...; } | - |
__namedParameters.overrides.semantic.colors.content.positive.background? | ... | - |
__namedParameters.overrides.semantic.colors.content.positive.border? | ... | - |
__namedParameters.overrides.semantic.colors.content.positive.text? | ... | - |
__namedParameters.overrides.semantic.colors.content.primary? | { background?: ...; border?: ...; text?: ...; } | - |
__namedParameters.overrides.semantic.colors.content.primary.background? | ... | - |
__namedParameters.overrides.semantic.colors.content.primary.border? | ... | - |
__namedParameters.overrides.semantic.colors.content.primary.text? | ... | - |
__namedParameters.overrides.semantic.colors.content.secondary? | { background?: ...; border?: ...; text?: ...; } | - |
__namedParameters.overrides.semantic.colors.content.secondary.background? | ... | - |
__namedParameters.overrides.semantic.colors.content.secondary.border? | ... | - |
__namedParameters.overrides.semantic.colors.content.secondary.text? | ... | - |
__namedParameters.overrides.semantic.colors.discovery? | { accent?: { background?: ...; border?: ...; text?: ...; }; muted?: { background?: ...; border?: ...; text?: ...; }; primary?: { background?: ...; border?: ...; text?: ...; }; secondary?: { background?: ...; border?: ...; text?: ...; }; } | - |
__namedParameters.overrides.semantic.colors.discovery.accent? | { background?: ...; border?: ...; text?: ...; } | - |
__namedParameters.overrides.semantic.colors.discovery.accent.background? | ... | - |
__namedParameters.overrides.semantic.colors.discovery.accent.border? | ... | - |
__namedParameters.overrides.semantic.colors.discovery.accent.text? | ... | - |
__namedParameters.overrides.semantic.colors.discovery.muted? | { background?: ...; border?: ...; text?: ...; } | - |
__namedParameters.overrides.semantic.colors.discovery.muted.background? | ... | - |
__namedParameters.overrides.semantic.colors.discovery.muted.border? | ... | - |
__namedParameters.overrides.semantic.colors.discovery.muted.text? | ... | - |
__namedParameters.overrides.semantic.colors.discovery.primary? | { background?: ...; border?: ...; text?: ...; } | - |
__namedParameters.overrides.semantic.colors.discovery.primary.background? | ... | - |
__namedParameters.overrides.semantic.colors.discovery.primary.border? | ... | - |
__namedParameters.overrides.semantic.colors.discovery.primary.text? | ... | - |
__namedParameters.overrides.semantic.colors.discovery.secondary? | { background?: ...; border?: ...; text?: ...; } | - |
__namedParameters.overrides.semantic.colors.discovery.secondary.background? | ... | - |
__namedParameters.overrides.semantic.colors.discovery.secondary.border? | ... | - |
__namedParameters.overrides.semantic.colors.discovery.secondary.text? | ... | - |
__namedParameters.overrides.semantic.colors.feedback? | { caution?: { background?: ...; border?: ...; text?: ...; }; muted?: { background?: ...; border?: ...; text?: ...; }; negative?: { background?: ...; border?: ...; text?: ...; }; positive?: { background?: ...; border?: ...; text?: ...; }; primary?: { background?: ...; border?: ...; text?: ...; }; } | - |
__namedParameters.overrides.semantic.colors.feedback.caution? | { background?: ...; border?: ...; text?: ...; } | - |
__namedParameters.overrides.semantic.colors.feedback.caution.background? | ... | - |
__namedParameters.overrides.semantic.colors.feedback.caution.border? | ... | - |
__namedParameters.overrides.semantic.colors.feedback.caution.text? | ... | - |
__namedParameters.overrides.semantic.colors.feedback.muted? | { background?: ...; border?: ...; text?: ...; } | - |
__namedParameters.overrides.semantic.colors.feedback.muted.background? | ... | - |
__namedParameters.overrides.semantic.colors.feedback.muted.border? | ... | - |
__namedParameters.overrides.semantic.colors.feedback.muted.text? | ... | - |
__namedParameters.overrides.semantic.colors.feedback.negative? | { background?: ...; border?: ...; text?: ...; } | - |
__namedParameters.overrides.semantic.colors.feedback.negative.background? | ... | - |
__namedParameters.overrides.semantic.colors.feedback.negative.border? | ... | - |
__namedParameters.overrides.semantic.colors.feedback.negative.text? | ... | - |
__namedParameters.overrides.semantic.colors.feedback.positive? | { background?: ...; border?: ...; text?: ...; } | - |
__namedParameters.overrides.semantic.colors.feedback.positive.background? | ... | - |
__namedParameters.overrides.semantic.colors.feedback.positive.border? | ... | - |
__namedParameters.overrides.semantic.colors.feedback.positive.text? | ... | - |
__namedParameters.overrides.semantic.colors.feedback.primary? | { background?: ...; border?: ...; text?: ...; } | - |
__namedParameters.overrides.semantic.colors.feedback.primary.background? | ... | - |
__namedParameters.overrides.semantic.colors.feedback.primary.border? | ... | - |
__namedParameters.overrides.semantic.colors.feedback.primary.text? | ... | - |
__namedParameters.overrides.semantic.colors.guidance? | { accent?: { background?: ...; border?: ...; text?: ...; }; caution?: { background?: ...; border?: ...; text?: ...; }; muted?: { background?: ...; border?: ...; text?: ...; }; primary?: { background?: ...; border?: ...; text?: ...; }; secondary?: { background?: ...; border?: ...; text?: ...; }; } | - |
__namedParameters.overrides.semantic.colors.guidance.accent? | { background?: ...; border?: ...; text?: ...; } | - |
__namedParameters.overrides.semantic.colors.guidance.accent.background? | ... | - |
__namedParameters.overrides.semantic.colors.guidance.accent.border? | ... | - |
__namedParameters.overrides.semantic.colors.guidance.accent.text? | ... | - |
__namedParameters.overrides.semantic.colors.guidance.caution? | { background?: ...; border?: ...; text?: ...; } | - |
__namedParameters.overrides.semantic.colors.guidance.caution.background? | ... | - |
__namedParameters.overrides.semantic.colors.guidance.caution.border? | ... | - |
__namedParameters.overrides.semantic.colors.guidance.caution.text? | ... | - |
__namedParameters.overrides.semantic.colors.guidance.muted? | { background?: ...; border?: ...; text?: ...; } | - |
__namedParameters.overrides.semantic.colors.guidance.muted.background? | ... | - |
__namedParameters.overrides.semantic.colors.guidance.muted.border? | ... | - |
__namedParameters.overrides.semantic.colors.guidance.muted.text? | ... | - |
__namedParameters.overrides.semantic.colors.guidance.primary? | { background?: ...; border?: ...; text?: ...; } | - |
__namedParameters.overrides.semantic.colors.guidance.primary.background? | ... | - |
__namedParameters.overrides.semantic.colors.guidance.primary.border? | ... | - |
__namedParameters.overrides.semantic.colors.guidance.primary.text? | ... | - |
__namedParameters.overrides.semantic.colors.guidance.secondary? | { background?: ...; border?: ...; text?: ...; } | - |
__namedParameters.overrides.semantic.colors.guidance.secondary.background? | ... | - |
__namedParameters.overrides.semantic.colors.guidance.secondary.border? | ... | - |
__namedParameters.overrides.semantic.colors.guidance.secondary.text? | ... | - |
__namedParameters.overrides.semantic.colors.input? | { caution?: { background?: ...; border?: ...; text?: ...; }; muted?: { background?: ...; border?: ...; text?: ...; }; negative?: { background?: ...; border?: ...; text?: ...; }; positive?: { background?: ...; border?: ...; text?: ...; }; primary?: { background?: ...; border?: ...; text?: ...; }; secondary?: { background?: ...; border?: ...; text?: ...; }; } | - |
__namedParameters.overrides.semantic.colors.input.caution? | { background?: ...; border?: ...; text?: ...; } | - |
__namedParameters.overrides.semantic.colors.input.caution.background? | ... | - |
__namedParameters.overrides.semantic.colors.input.caution.border? | ... | - |
__namedParameters.overrides.semantic.colors.input.caution.text? | ... | - |
__namedParameters.overrides.semantic.colors.input.muted? | { background?: ...; border?: ...; text?: ...; } | - |
__namedParameters.overrides.semantic.colors.input.muted.background? | ... | - |
__namedParameters.overrides.semantic.colors.input.muted.border? | ... | - |
__namedParameters.overrides.semantic.colors.input.muted.text? | ... | - |
__namedParameters.overrides.semantic.colors.input.negative? | { background?: ...; border?: ...; text?: ...; } | - |
__namedParameters.overrides.semantic.colors.input.negative.background? | ... | - |
__namedParameters.overrides.semantic.colors.input.negative.border? | ... | - |
__namedParameters.overrides.semantic.colors.input.negative.text? | ... | - |
__namedParameters.overrides.semantic.colors.input.positive? | { background?: ...; border?: ...; text?: ...; } | - |
__namedParameters.overrides.semantic.colors.input.positive.background? | ... | - |
__namedParameters.overrides.semantic.colors.input.positive.border? | ... | - |
__namedParameters.overrides.semantic.colors.input.positive.text? | ... | - |
__namedParameters.overrides.semantic.colors.input.primary? | { background?: ...; border?: ...; text?: ...; } | - |
__namedParameters.overrides.semantic.colors.input.primary.background? | ... | - |
__namedParameters.overrides.semantic.colors.input.primary.border? | ... | - |
__namedParameters.overrides.semantic.colors.input.primary.text? | ... | - |
__namedParameters.overrides.semantic.colors.input.secondary? | { background?: ...; border?: ...; text?: ...; } | - |
__namedParameters.overrides.semantic.colors.input.secondary.background? | ... | - |
__namedParameters.overrides.semantic.colors.input.secondary.border? | ... | - |
__namedParameters.overrides.semantic.colors.input.secondary.text? | ... | - |
__namedParameters.overrides.semantic.colors.navigation? | { accent?: { background?: ...; border?: ...; text?: ...; }; muted?: { background?: ...; border?: ...; text?: ...; }; primary?: { background?: ...; border?: ...; text?: ...; }; secondary?: { background?: ...; border?: ...; text?: ...; }; } | - |
__namedParameters.overrides.semantic.colors.navigation.accent? | { background?: ...; border?: ...; text?: ...; } | - |
__namedParameters.overrides.semantic.colors.navigation.accent.background? | ... | - |
__namedParameters.overrides.semantic.colors.navigation.accent.border? | ... | - |
__namedParameters.overrides.semantic.colors.navigation.accent.text? | ... | - |
__namedParameters.overrides.semantic.colors.navigation.muted? | { background?: ...; border?: ...; text?: ...; } | - |
__namedParameters.overrides.semantic.colors.navigation.muted.background? | ... | - |
__namedParameters.overrides.semantic.colors.navigation.muted.border? | ... | - |
__namedParameters.overrides.semantic.colors.navigation.muted.text? | ... | - |
__namedParameters.overrides.semantic.colors.navigation.primary? | { background?: ...; border?: ...; text?: ...; } | - |
__namedParameters.overrides.semantic.colors.navigation.primary.background? | ... | - |
__namedParameters.overrides.semantic.colors.navigation.primary.border? | ... | - |
__namedParameters.overrides.semantic.colors.navigation.primary.text? | ... | - |
__namedParameters.overrides.semantic.colors.navigation.secondary? | { background?: ...; border?: ...; text?: ...; } | - |
__namedParameters.overrides.semantic.colors.navigation.secondary.background? | ... | - |
__namedParameters.overrides.semantic.colors.navigation.secondary.border? | ... | - |
__namedParameters.overrides.semantic.colors.navigation.secondary.text? | ... | - |
__namedParameters.overrides.semantic.dataviz? | { color?: { reference?: { baseline?: ...; target?: ...; }; scale?: { diverging?: ...; sequential?: ...; }; series?: { 1?: ...; 2?: ...; 3?: ...; 4?: ...; 5?: ...; 6?: ...; 7?: ...; 8?: ...; }; state?: { highlight?: ...; muted?: ...; selected?: ...; }; status?: { missing?: ...; not-applicable?: ...; suppressed?: ...; }; }; encoding?: { opacity?: { context?: ...; muted?: ...; uncertainty?: ...; }; pattern?: { series?: ...; }; shape?: { series?: ...; }; stroke?: { forecast?: ...; reference?: ...; uncertainty?: ...; }; }; geo?: { context?: { boundary?: ...; label?: ...; muted?: ...; }; state?: { focus?: ...; selection?: ...; }; }; } | Data Visualization extension — semantic roles for analytical color, non-color encodings, and geospatial overlays. Optional: omit when the theme does not support dataviz. This is the public API of the dataviz extension. Components consume these tokens; never core.dataviz.* directly. |
__namedParameters.overrides.semantic.dataviz.color? | { reference?: { baseline?: ...; target?: ...; }; scale?: { diverging?: ...; sequential?: ...; }; series?: { 1?: ...; 2?: ...; 3?: ...; 4?: ...; 5?: ...; 6?: ...; 7?: ...; 8?: ...; }; state?: { highlight?: ...; muted?: ...; selected?: ...; }; status?: { missing?: ...; not-applicable?: ...; suppressed?: ...; }; } | - |
__namedParameters.overrides.semantic.dataviz.color.reference? | { baseline?: ...; target?: ...; } | - |
__namedParameters.overrides.semantic.dataviz.color.reference.baseline? | ... | Color for a baseline or reference level (e.g. average, goal). |
__namedParameters.overrides.semantic.dataviz.color.reference.target? | ... | Color for a target or objective line. |
__namedParameters.overrides.semantic.dataviz.color.scale? | { diverging?: ...; sequential?: ...; } | - |
__namedParameters.overrides.semantic.dataviz.color.scale.diverging? | ... | Midpoint comparison — 7 named positions around a true center. Only use when the data has a meaningful midpoint (zero, baseline, target). |
__namedParameters.overrides.semantic.dataviz.color.scale.sequential? | ... | Ordered magnitude — 7 steps from low (1) to high (7). Use for quantitative ranges and progressive intensity. |
__namedParameters.overrides.semantic.dataviz.color.series? | { 1?: ...; 2?: ...; 3?: ...; 4?: ...; 5?: ...; 6?: ...; 7?: ...; 8?: ...; } | Categorical series identity — 8 named, unordered roles. Use for nominal categories, named series, distinct groups. |
__namedParameters.overrides.semantic.dataviz.color.series.1? | ... | - |
__namedParameters.overrides.semantic.dataviz.color.series.2? | ... | - |
__namedParameters.overrides.semantic.dataviz.color.series.3? | ... | - |
__namedParameters.overrides.semantic.dataviz.color.series.4? | ... | - |
__namedParameters.overrides.semantic.dataviz.color.series.5? | ... | - |
__namedParameters.overrides.semantic.dataviz.color.series.6? | ... | - |
__namedParameters.overrides.semantic.dataviz.color.series.7? | ... | - |
__namedParameters.overrides.semantic.dataviz.color.series.8? | ... | - |
__namedParameters.overrides.semantic.dataviz.color.state? | { highlight?: ...; muted?: ...; selected?: ...; } | - |
__namedParameters.overrides.semantic.dataviz.color.state.highlight? | ... | Emphasized / highlighted data mark. |
__namedParameters.overrides.semantic.dataviz.color.state.muted? | ... | De-emphasized / non-highlighted data mark. |
__namedParameters.overrides.semantic.dataviz.color.state.selected? | ... | User-selected or actively focused data mark. |
__namedParameters.overrides.semantic.dataviz.color.status? | { missing?: ...; not-applicable?: ...; suppressed?: ...; } | - |
__namedParameters.overrides.semantic.dataviz.color.status.missing? | ... | Value is absent or unavailable. |
__namedParameters.overrides.semantic.dataviz.color.status.not-applicable? | ... | Value is structurally absent (not measured or not applicable). |
__namedParameters.overrides.semantic.dataviz.color.status.suppressed? | ... | Value is withheld for confidentiality or publication rules. |
__namedParameters.overrides.semantic.dataviz.encoding? | { opacity?: { context?: ...; muted?: ...; uncertainty?: ...; }; pattern?: { series?: ...; }; shape?: { series?: ...; }; stroke?: { forecast?: ...; reference?: ...; uncertainty?: ...; }; } | - |
__namedParameters.overrides.semantic.dataviz.encoding.opacity? | { context?: ...; muted?: ...; uncertainty?: ...; } | - |
__namedParameters.overrides.semantic.dataviz.encoding.opacity.context? | ... | Opacity for contextual elements behind overlay data. |
__namedParameters.overrides.semantic.dataviz.encoding.opacity.muted? | ... | Opacity for de-emphasized (non-highlighted) data marks. |
__namedParameters.overrides.semantic.dataviz.encoding.opacity.uncertainty? | ... | Opacity for representing estimated or uncertain data visually. |
__namedParameters.overrides.semantic.dataviz.encoding.pattern? | { series?: ...; } | - |
__namedParameters.overrides.semantic.dataviz.encoding.pattern.series? | ... | Series identity through fill texture — use for filled marks and overlays. |
__namedParameters.overrides.semantic.dataviz.encoding.shape? | { series?: ...; } | - |
__namedParameters.overrides.semantic.dataviz.encoding.shape.series? | ... | Series identity through mark shape — use for redundant differentiation. |
__namedParameters.overrides.semantic.dataviz.encoding.stroke? | { forecast?: ...; reference?: ...; uncertainty?: ...; } | - |
__namedParameters.overrides.semantic.dataviz.encoding.stroke.forecast? | ... | Stroke style for projected or forward-looking data segments. |
__namedParameters.overrides.semantic.dataviz.encoding.stroke.reference? | ... | Stroke style for analytical reference guides or baselines. |
__namedParameters.overrides.semantic.dataviz.encoding.stroke.uncertainty? | ... | Stroke style for uncertain or estimated bounds. |
__namedParameters.overrides.semantic.dataviz.geo? | { context?: { boundary?: ...; label?: ...; muted?: ...; }; state?: { focus?: ...; selection?: ...; }; } | - |
__namedParameters.overrides.semantic.dataviz.geo.context? | { boundary?: ...; label?: ...; muted?: ...; } | - |
__namedParameters.overrides.semantic.dataviz.geo.context.boundary? | ... | Color for supportive boundary lines (region outlines, coastlines). |
__namedParameters.overrides.semantic.dataviz.geo.context.label? | ... | Color for contextual geographic labels (city names, region labels). |
__namedParameters.overrides.semantic.dataviz.geo.context.muted? | ... | Reduced background wash for geographic base layer. |
__namedParameters.overrides.semantic.dataviz.geo.state? | { focus?: ...; selection?: ...; } | - |
__namedParameters.overrides.semantic.dataviz.geo.state.focus? | ... | Fill or stroke for spatially focused region (keyboard / pointer focus). |
__namedParameters.overrides.semantic.dataviz.geo.state.selection? | ... | Fill or stroke for a spatially selected region. |
__namedParameters.overrides.semantic.elevation? | { surface?: { blocking?: `{${(...)}}`; flat?: `{${(...)}}`; overlay?: `{${(...)}}`; raised?: `{${(...)}}`; }; } | - |
__namedParameters.overrides.semantic.elevation.surface? | { blocking?: `{${(...)}}`; flat?: `{${(...)}}`; overlay?: `{${(...)}}`; raised?: `{${(...)}}`; } | - |
__namedParameters.overrides.semantic.elevation.surface.blocking? | `{${(...)}}` | Dialogs and blocking sheets |
__namedParameters.overrides.semantic.elevation.surface.flat? | `{${(...)}}` | Surfaces flush with the page |
__namedParameters.overrides.semantic.elevation.surface.overlay? | `{${(...)}}` | Dropdowns, popovers, floating surfaces |
__namedParameters.overrides.semantic.elevation.surface.raised? | `{${(...)}}` | Cards and panels |
__namedParameters.overrides.semantic.focus? | { ring?: { style?: `{${(...)}}`; width?: `{${(...)}}`; }; } | - |
__namedParameters.overrides.semantic.focus.ring? | { style?: `{${(...)}}`; width?: `{${(...)}}`; } | - |
__namedParameters.overrides.semantic.focus.ring.style? | `{${(...)}}` | - |
__namedParameters.overrides.semantic.focus.ring.width? | `{${(...)}}` | - |
__namedParameters.overrides.semantic.motion? | { decorative?: { duration?: `{${(...)}}`; easing?: `{${(...)}}`; }; emphasis?: { duration?: `{${(...)}}`; easing?: `{${(...)}}`; }; feedback?: { duration?: `{${(...)}}`; easing?: `{${(...)}}`; }; transition?: { enter?: { duration?: ...; easing?: ...; }; exit?: { duration?: ...; easing?: ...; }; }; } | - |
__namedParameters.overrides.semantic.motion.decorative? | { duration?: `{${(...)}}`; easing?: `{${(...)}}`; } | - |
__namedParameters.overrides.semantic.motion.decorative.duration? | `{${(...)}}` | - |
__namedParameters.overrides.semantic.motion.decorative.easing? | `{${(...)}}` | - |
__namedParameters.overrides.semantic.motion.emphasis? | { duration?: `{${(...)}}`; easing?: `{${(...)}}`; } | - |
__namedParameters.overrides.semantic.motion.emphasis.duration? | `{${(...)}}` | - |
__namedParameters.overrides.semantic.motion.emphasis.easing? | `{${(...)}}` | - |
__namedParameters.overrides.semantic.motion.feedback? | { duration?: `{${(...)}}`; easing?: `{${(...)}}`; } | - |
__namedParameters.overrides.semantic.motion.feedback.duration? | `{${(...)}}` | - |
__namedParameters.overrides.semantic.motion.feedback.easing? | `{${(...)}}` | - |
__namedParameters.overrides.semantic.motion.transition? | { enter?: { duration?: ...; easing?: ...; }; exit?: { duration?: ...; easing?: ...; }; } | - |
__namedParameters.overrides.semantic.motion.transition.enter? | { duration?: ...; easing?: ...; } | - |
__namedParameters.overrides.semantic.motion.transition.enter.duration? | ... | - |
__namedParameters.overrides.semantic.motion.transition.enter.easing? | ... | - |
__namedParameters.overrides.semantic.motion.transition.exit? | { duration?: ...; easing?: ...; } | - |
__namedParameters.overrides.semantic.motion.transition.exit.duration? | ... | - |
__namedParameters.overrides.semantic.motion.transition.exit.easing? | ... | - |
__namedParameters.overrides.semantic.opacity? | { disabledMedia?: `{${string}}`; loading?: `{${string}}`; scrim?: `{${string}}`; } | - |
__namedParameters.overrides.semantic.opacity.disabledMedia? | `{${string}}` | - |
__namedParameters.overrides.semantic.opacity.loading? | `{${string}}` | - |
__namedParameters.overrides.semantic.opacity.scrim? | `{${string}}` | - |
__namedParameters.overrides.semantic.radii? | { control?: `{${string}}`; round?: `{${string}}`; surface?: `{${string}}`; } | - |
__namedParameters.overrides.semantic.radii.control? | `{${string}}` | - |
__namedParameters.overrides.semantic.radii.round? | `{${string}}` | - |
__namedParameters.overrides.semantic.radii.surface? | `{${string}}` | - |
__namedParameters.overrides.semantic.sizing? | { hit?: { default?: `{${(...)}}`; min?: `{${(...)}}`; prominent?: `{${(...)}}`; }; icon?: { lg?: `{${(...)}}`; md?: `{${(...)}}`; sm?: `{${(...)}}`; }; identity?: { lg?: `{${(...)}}`; md?: `{${(...)}}`; sm?: `{${(...)}}`; xl?: `{${(...)}}`; }; measure?: { reading?: string; }; surface?: { maxWidth?: `{${(...)}}`; }; viewport?: { height?: { full?: ...; }; }; } | - |
__namedParameters.overrides.semantic.sizing.hit? | { default?: `{${(...)}}`; min?: `{${(...)}}`; prominent?: `{${(...)}}`; } | - |
__namedParameters.overrides.semantic.sizing.hit.default? | `{${(...)}}` | - |
__namedParameters.overrides.semantic.sizing.hit.min? | `{${(...)}}` | Resolves to fine-pointer value; coarse-pointer override emitted by toCssVars |
__namedParameters.overrides.semantic.sizing.hit.prominent? | `{${(...)}}` | - |
__namedParameters.overrides.semantic.sizing.icon? | { lg?: `{${(...)}}`; md?: `{${(...)}}`; sm?: `{${(...)}}`; } | - |
__namedParameters.overrides.semantic.sizing.icon.lg? | `{${(...)}}` | - |
__namedParameters.overrides.semantic.sizing.icon.md? | `{${(...)}}` | - |
__namedParameters.overrides.semantic.sizing.icon.sm? | `{${(...)}}` | - |
__namedParameters.overrides.semantic.sizing.identity? | { lg?: `{${(...)}}`; md?: `{${(...)}}`; sm?: `{${(...)}}`; xl?: `{${(...)}}`; } | - |
__namedParameters.overrides.semantic.sizing.identity.lg? | `{${(...)}}` | - |
__namedParameters.overrides.semantic.sizing.identity.md? | `{${(...)}}` | - |
__namedParameters.overrides.semantic.sizing.identity.sm? | `{${(...)}}` | - |
__namedParameters.overrides.semantic.sizing.identity.xl? | `{${(...)}}` | - |
__namedParameters.overrides.semantic.sizing.measure? | { reading?: string; } | - |
__namedParameters.overrides.semantic.sizing.measure.reading? | string | - |
__namedParameters.overrides.semantic.sizing.surface? | { maxWidth?: `{${(...)}}`; } | - |
__namedParameters.overrides.semantic.sizing.surface.maxWidth? | `{${(...)}}` | - |
__namedParameters.overrides.semantic.sizing.viewport? | { height?: { full?: ...; }; } | - |
__namedParameters.overrides.semantic.sizing.viewport.height? | { full?: ...; } | - |
__namedParameters.overrides.semantic.sizing.viewport.height.full? | ... | - |
__namedParameters.overrides.semantic.spacing? | { gap?: { inline?: { lg?: ...; md?: ...; sm?: ...; xs?: ...; }; stack?: { lg?: ...; md?: ...; sm?: ...; xl?: ...; xs?: ...; }; }; gutter?: { page?: string; section?: string; }; inset?: { control?: { lg?: ...; md?: ...; sm?: ...; }; surface?: { lg?: ...; md?: ...; sm?: ...; }; }; separation?: { interactive?: { min?: ...; }; }; } | - |
__namedParameters.overrides.semantic.spacing.gap? | { inline?: { lg?: ...; md?: ...; sm?: ...; xs?: ...; }; stack?: { lg?: ...; md?: ...; sm?: ...; xl?: ...; xs?: ...; }; } | - |
__namedParameters.overrides.semantic.spacing.gap.inline? | { lg?: ...; md?: ...; sm?: ...; xs?: ...; } | - |
__namedParameters.overrides.semantic.spacing.gap.inline.lg? | ... | - |
__namedParameters.overrides.semantic.spacing.gap.inline.md? | ... | - |
__namedParameters.overrides.semantic.spacing.gap.inline.sm? | ... | - |
__namedParameters.overrides.semantic.spacing.gap.inline.xs? | ... | - |
__namedParameters.overrides.semantic.spacing.gap.stack? | { lg?: ...; md?: ...; sm?: ...; xl?: ...; xs?: ...; } | - |
__namedParameters.overrides.semantic.spacing.gap.stack.lg? | ... | - |
__namedParameters.overrides.semantic.spacing.gap.stack.md? | ... | - |
__namedParameters.overrides.semantic.spacing.gap.stack.sm? | ... | - |
__namedParameters.overrides.semantic.spacing.gap.stack.xl? | ... | - |
__namedParameters.overrides.semantic.spacing.gap.stack.xs? | ... | - |
__namedParameters.overrides.semantic.spacing.gutter? | { page?: string; section?: string; } | page and section may use a clamp() expression with embedded {token.path} refs (e.g. clamp({core.space.4}, {core.space.6}, {core.space.12})). Typed as RawValue to allow both simple refs and responsive clamp expressions. |
__namedParameters.overrides.semantic.spacing.gutter.page? | string | - |
__namedParameters.overrides.semantic.spacing.gutter.section? | string | - |
__namedParameters.overrides.semantic.spacing.inset? | { control?: { lg?: ...; md?: ...; sm?: ...; }; surface?: { lg?: ...; md?: ...; sm?: ...; }; } | - |
__namedParameters.overrides.semantic.spacing.inset.control? | { lg?: ...; md?: ...; sm?: ...; } | - |
__namedParameters.overrides.semantic.spacing.inset.control.lg? | ... | - |
__namedParameters.overrides.semantic.spacing.inset.control.md? | ... | - |
__namedParameters.overrides.semantic.spacing.inset.control.sm? | ... | - |
__namedParameters.overrides.semantic.spacing.inset.surface? | { lg?: ...; md?: ...; sm?: ...; } | - |
__namedParameters.overrides.semantic.spacing.inset.surface.lg? | ... | - |
__namedParameters.overrides.semantic.spacing.inset.surface.md? | ... | - |
__namedParameters.overrides.semantic.spacing.inset.surface.sm? | ... | - |
__namedParameters.overrides.semantic.spacing.separation? | { interactive?: { min?: ...; }; } | May use a clamp() expression with an embedded {token.path} ref (e.g. clamp(8px, {core.space.2}, 12px)). |
__namedParameters.overrides.semantic.spacing.separation.interactive? | { min?: ...; } | - |
__namedParameters.overrides.semantic.spacing.separation.interactive.min? | ... | - |
__namedParameters.overrides.semantic.text? | { body?: { lg?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; md?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; sm?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; }; code?: { md?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; sm?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; }; display?: { lg?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; md?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; sm?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; }; headline?: { lg?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; md?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; sm?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; }; label?: { lg?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; md?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; sm?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; }; title?: { lg?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; md?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; sm?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; }; } | - |
__namedParameters.overrides.semantic.text.body? | { lg?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; md?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; sm?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; } | - |
__namedParameters.overrides.semantic.text.body.lg? | { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; } | - |
__namedParameters.overrides.semantic.text.body.lg.fontFamily? | ... | - |
__namedParameters.overrides.semantic.text.body.lg.fontOpticalSizing? | ... | - |
__namedParameters.overrides.semantic.text.body.lg.fontSize? | ... | - |
__namedParameters.overrides.semantic.text.body.lg.fontVariantNumeric? | ... | - |
__namedParameters.overrides.semantic.text.body.lg.fontWeight? | ... | - |
__namedParameters.overrides.semantic.text.body.lg.letterSpacing? | ... | - |
__namedParameters.overrides.semantic.text.body.lg.lineHeight? | ... | - |
__namedParameters.overrides.semantic.text.body.md? | { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; } | - |
__namedParameters.overrides.semantic.text.body.md.fontFamily? | ... | - |
__namedParameters.overrides.semantic.text.body.md.fontOpticalSizing? | ... | - |
__namedParameters.overrides.semantic.text.body.md.fontSize? | ... | - |
__namedParameters.overrides.semantic.text.body.md.fontVariantNumeric? | ... | - |
__namedParameters.overrides.semantic.text.body.md.fontWeight? | ... | - |
__namedParameters.overrides.semantic.text.body.md.letterSpacing? | ... | - |
__namedParameters.overrides.semantic.text.body.md.lineHeight? | ... | - |
__namedParameters.overrides.semantic.text.body.sm? | { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; } | - |
__namedParameters.overrides.semantic.text.body.sm.fontFamily? | ... | - |
__namedParameters.overrides.semantic.text.body.sm.fontOpticalSizing? | ... | - |
__namedParameters.overrides.semantic.text.body.sm.fontSize? | ... | - |
__namedParameters.overrides.semantic.text.body.sm.fontVariantNumeric? | ... | - |
__namedParameters.overrides.semantic.text.body.sm.fontWeight? | ... | - |
__namedParameters.overrides.semantic.text.body.sm.letterSpacing? | ... | - |
__namedParameters.overrides.semantic.text.body.sm.lineHeight? | ... | - |
__namedParameters.overrides.semantic.text.code? | { md?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; sm?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; } | - |
__namedParameters.overrides.semantic.text.code.md? | { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; } | - |
__namedParameters.overrides.semantic.text.code.md.fontFamily? | ... | - |
__namedParameters.overrides.semantic.text.code.md.fontOpticalSizing? | ... | - |
__namedParameters.overrides.semantic.text.code.md.fontSize? | ... | - |
__namedParameters.overrides.semantic.text.code.md.fontVariantNumeric? | ... | - |
__namedParameters.overrides.semantic.text.code.md.fontWeight? | ... | - |
__namedParameters.overrides.semantic.text.code.md.letterSpacing? | ... | - |
__namedParameters.overrides.semantic.text.code.md.lineHeight? | ... | - |
__namedParameters.overrides.semantic.text.code.sm? | { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; } | - |
__namedParameters.overrides.semantic.text.code.sm.fontFamily? | ... | - |
__namedParameters.overrides.semantic.text.code.sm.fontOpticalSizing? | ... | - |
__namedParameters.overrides.semantic.text.code.sm.fontSize? | ... | - |
__namedParameters.overrides.semantic.text.code.sm.fontVariantNumeric? | ... | - |
__namedParameters.overrides.semantic.text.code.sm.fontWeight? | ... | - |
__namedParameters.overrides.semantic.text.code.sm.letterSpacing? | ... | - |
__namedParameters.overrides.semantic.text.code.sm.lineHeight? | ... | - |
__namedParameters.overrides.semantic.text.display? | { lg?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; md?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; sm?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; } | - |
__namedParameters.overrides.semantic.text.display.lg? | { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; } | - |
__namedParameters.overrides.semantic.text.display.lg.fontFamily? | ... | - |
__namedParameters.overrides.semantic.text.display.lg.fontOpticalSizing? | ... | - |
__namedParameters.overrides.semantic.text.display.lg.fontSize? | ... | - |
__namedParameters.overrides.semantic.text.display.lg.fontVariantNumeric? | ... | - |
__namedParameters.overrides.semantic.text.display.lg.fontWeight? | ... | - |
__namedParameters.overrides.semantic.text.display.lg.letterSpacing? | ... | - |
__namedParameters.overrides.semantic.text.display.lg.lineHeight? | ... | - |
__namedParameters.overrides.semantic.text.display.md? | { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; } | - |
__namedParameters.overrides.semantic.text.display.md.fontFamily? | ... | - |
__namedParameters.overrides.semantic.text.display.md.fontOpticalSizing? | ... | - |
__namedParameters.overrides.semantic.text.display.md.fontSize? | ... | - |
__namedParameters.overrides.semantic.text.display.md.fontVariantNumeric? | ... | - |
__namedParameters.overrides.semantic.text.display.md.fontWeight? | ... | - |
__namedParameters.overrides.semantic.text.display.md.letterSpacing? | ... | - |
__namedParameters.overrides.semantic.text.display.md.lineHeight? | ... | - |
__namedParameters.overrides.semantic.text.display.sm? | { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; } | - |
__namedParameters.overrides.semantic.text.display.sm.fontFamily? | ... | - |
__namedParameters.overrides.semantic.text.display.sm.fontOpticalSizing? | ... | - |
__namedParameters.overrides.semantic.text.display.sm.fontSize? | ... | - |
__namedParameters.overrides.semantic.text.display.sm.fontVariantNumeric? | ... | - |
__namedParameters.overrides.semantic.text.display.sm.fontWeight? | ... | - |
__namedParameters.overrides.semantic.text.display.sm.letterSpacing? | ... | - |
__namedParameters.overrides.semantic.text.display.sm.lineHeight? | ... | - |
__namedParameters.overrides.semantic.text.headline? | { lg?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; md?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; sm?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; } | - |
__namedParameters.overrides.semantic.text.headline.lg? | { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; } | - |
__namedParameters.overrides.semantic.text.headline.lg.fontFamily? | ... | - |
__namedParameters.overrides.semantic.text.headline.lg.fontOpticalSizing? | ... | - |
__namedParameters.overrides.semantic.text.headline.lg.fontSize? | ... | - |
__namedParameters.overrides.semantic.text.headline.lg.fontVariantNumeric? | ... | - |
__namedParameters.overrides.semantic.text.headline.lg.fontWeight? | ... | - |
__namedParameters.overrides.semantic.text.headline.lg.letterSpacing? | ... | - |
__namedParameters.overrides.semantic.text.headline.lg.lineHeight? | ... | - |
__namedParameters.overrides.semantic.text.headline.md? | { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; } | - |
__namedParameters.overrides.semantic.text.headline.md.fontFamily? | ... | - |
__namedParameters.overrides.semantic.text.headline.md.fontOpticalSizing? | ... | - |
__namedParameters.overrides.semantic.text.headline.md.fontSize? | ... | - |
__namedParameters.overrides.semantic.text.headline.md.fontVariantNumeric? | ... | - |
__namedParameters.overrides.semantic.text.headline.md.fontWeight? | ... | - |
__namedParameters.overrides.semantic.text.headline.md.letterSpacing? | ... | - |
__namedParameters.overrides.semantic.text.headline.md.lineHeight? | ... | - |
__namedParameters.overrides.semantic.text.headline.sm? | { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; } | - |
__namedParameters.overrides.semantic.text.headline.sm.fontFamily? | ... | - |
__namedParameters.overrides.semantic.text.headline.sm.fontOpticalSizing? | ... | - |
__namedParameters.overrides.semantic.text.headline.sm.fontSize? | ... | - |
__namedParameters.overrides.semantic.text.headline.sm.fontVariantNumeric? | ... | - |
__namedParameters.overrides.semantic.text.headline.sm.fontWeight? | ... | - |
__namedParameters.overrides.semantic.text.headline.sm.letterSpacing? | ... | - |
__namedParameters.overrides.semantic.text.headline.sm.lineHeight? | ... | - |
__namedParameters.overrides.semantic.text.label? | { lg?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; md?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; sm?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; } | - |
__namedParameters.overrides.semantic.text.label.lg? | { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; } | - |
__namedParameters.overrides.semantic.text.label.lg.fontFamily? | ... | - |
__namedParameters.overrides.semantic.text.label.lg.fontOpticalSizing? | ... | - |
__namedParameters.overrides.semantic.text.label.lg.fontSize? | ... | - |
__namedParameters.overrides.semantic.text.label.lg.fontVariantNumeric? | ... | - |
__namedParameters.overrides.semantic.text.label.lg.fontWeight? | ... | - |
__namedParameters.overrides.semantic.text.label.lg.letterSpacing? | ... | - |
__namedParameters.overrides.semantic.text.label.lg.lineHeight? | ... | - |
__namedParameters.overrides.semantic.text.label.md? | { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; } | - |
__namedParameters.overrides.semantic.text.label.md.fontFamily? | ... | - |
__namedParameters.overrides.semantic.text.label.md.fontOpticalSizing? | ... | - |
__namedParameters.overrides.semantic.text.label.md.fontSize? | ... | - |
__namedParameters.overrides.semantic.text.label.md.fontVariantNumeric? | ... | - |
__namedParameters.overrides.semantic.text.label.md.fontWeight? | ... | - |
__namedParameters.overrides.semantic.text.label.md.letterSpacing? | ... | - |
__namedParameters.overrides.semantic.text.label.md.lineHeight? | ... | - |
__namedParameters.overrides.semantic.text.label.sm? | { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; } | - |
__namedParameters.overrides.semantic.text.label.sm.fontFamily? | ... | - |
__namedParameters.overrides.semantic.text.label.sm.fontOpticalSizing? | ... | - |
__namedParameters.overrides.semantic.text.label.sm.fontSize? | ... | - |
__namedParameters.overrides.semantic.text.label.sm.fontVariantNumeric? | ... | - |
__namedParameters.overrides.semantic.text.label.sm.fontWeight? | ... | - |
__namedParameters.overrides.semantic.text.label.sm.letterSpacing? | ... | - |
__namedParameters.overrides.semantic.text.label.sm.lineHeight? | ... | - |
__namedParameters.overrides.semantic.text.title? | { lg?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; md?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; sm?: { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; }; } | - |
__namedParameters.overrides.semantic.text.title.lg? | { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; } | - |
__namedParameters.overrides.semantic.text.title.lg.fontFamily? | ... | - |
__namedParameters.overrides.semantic.text.title.lg.fontOpticalSizing? | ... | - |
__namedParameters.overrides.semantic.text.title.lg.fontSize? | ... | - |
__namedParameters.overrides.semantic.text.title.lg.fontVariantNumeric? | ... | - |
__namedParameters.overrides.semantic.text.title.lg.fontWeight? | ... | - |
__namedParameters.overrides.semantic.text.title.lg.letterSpacing? | ... | - |
__namedParameters.overrides.semantic.text.title.lg.lineHeight? | ... | - |
__namedParameters.overrides.semantic.text.title.md? | { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; } | - |
__namedParameters.overrides.semantic.text.title.md.fontFamily? | ... | - |
__namedParameters.overrides.semantic.text.title.md.fontOpticalSizing? | ... | - |
__namedParameters.overrides.semantic.text.title.md.fontSize? | ... | - |
__namedParameters.overrides.semantic.text.title.md.fontVariantNumeric? | ... | - |
__namedParameters.overrides.semantic.text.title.md.fontWeight? | ... | - |
__namedParameters.overrides.semantic.text.title.md.letterSpacing? | ... | - |
__namedParameters.overrides.semantic.text.title.md.lineHeight? | ... | - |
__namedParameters.overrides.semantic.text.title.sm? | { fontFamily?: ...; fontOpticalSizing?: ...; fontSize?: ...; fontVariantNumeric?: ...; fontWeight?: ...; letterSpacing?: ...; lineHeight?: ...; } | - |
__namedParameters.overrides.semantic.text.title.sm.fontFamily? | ... | - |
__namedParameters.overrides.semantic.text.title.sm.fontOpticalSizing? | ... | - |
__namedParameters.overrides.semantic.text.title.sm.fontSize? | ... | - |
__namedParameters.overrides.semantic.text.title.sm.fontVariantNumeric? | ... | - |
__namedParameters.overrides.semantic.text.title.sm.fontWeight? | ... | - |
__namedParameters.overrides.semantic.text.title.sm.letterSpacing? | ... | - |
__namedParameters.overrides.semantic.text.title.sm.lineHeight? | ... | - |
__namedParameters.overrides.semantic.zIndex? | { layer?: { base?: `{${(...)}}`; blocking?: `{${(...)}}`; overlay?: `{${(...)}}`; sticky?: `{${(...)}}`; transient?: `{${(...)}}`; }; } | - |
__namedParameters.overrides.semantic.zIndex.layer? | { base?: `{${(...)}}`; blocking?: `{${(...)}}`; overlay?: `{${(...)}}`; sticky?: `{${(...)}}`; transient?: `{${(...)}}`; } | - |
__namedParameters.overrides.semantic.zIndex.layer.base? | `{${(...)}}` | - |
__namedParameters.overrides.semantic.zIndex.layer.blocking? | `{${(...)}}` | - |
__namedParameters.overrides.semantic.zIndex.layer.overlay? | `{${(...)}}` | - |
__namedParameters.overrides.semantic.zIndex.layer.sticky? | `{${(...)}}` | - |
__namedParameters.overrides.semantic.zIndex.layer.transient? | `{${(...)}}` | - |
Returns
Example
// Path A — default foundation (light base + dark alternate included)
const myTheme = createTheme();
<ThemeProvider theme={myTheme} />
// Path B — custom brand overrides (dark mode still included)
const myTheme = createTheme({
overrides: { core: { colors: { brand: { 500: '#FF0000' } } } },
});
// Path C — custom semantic dark alternate
const myTheme = createTheme({
overrides: { core: { colors: { brand: { 500: '#FF0000' } } } },
alternate: {
semantic: {
colors: { content: { primary: { background: { default: '{core.colors.neutral.900}' } } } },
},
},
});
// Path D — single-mode theme (no dark alternate)
const myTheme = createTheme({ alternate: null });