Knobs¶

The overridable surface: 27 values, each a single number or colour. Defaults are Tabler's measured values, so a project that overrides nothing looks like Tabler.

Override them on :root after the stylesheet, or on any [data-ads-scope] subtree. See Knobs and derivation for how far each one reaches.

brand¶

token	value	note
`--ads-brand`	`#066fd1`
`--ads-contrast`	`0`
`--ads-brand-fg`	`#f9fafb`	text on a filled brand surface — Tabler's light
`--ads-neutral-hue`	`220`
`--ads-neutral-chroma`	`1`
`--ads-success`	`#2fb344`
`--ads-warning`	`#f76707`
`--ads-danger`	`#d63939`
`--ads-info`	`#4299e1`

shape¶

token	value
`--ads-radius-scale`	`1`
`--ads-border-width`	`1px`

depth¶

token	value
`--ads-shadow-strength`	`1`
`--ads-shadow-color`	`light-dark(rgb(18 18 23), rgb(0 0 0))`

space¶

token	value
`--ads-space-scale`	`1`
`--ads-space-unit`	`0.25rem`

type¶

token	value	note
`--ads-text-base`	`0.875rem`	14px — Tabler's body size
`--ads-line-height`	`1.4285714286`

shell¶

token	value	note
`--ads-sidebar-width`	`16rem`
`--ads-sidebar-folded`	`4rem`	Tabler's
`--ads-avatar-size`	`var(--ads-control)`
`--ads-icon-size`	`var(--ads-control-xs)`
`--ads-container`	`82rem`
`--ads-font`	`system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif`
`--ads-font-mono`	`ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace`
`--ads-weight-normal`	`400`
`--ads-weight-medium`	`500`
`--ads-weight-bold`	`600`