color

stroke

Applies stroke, resolving a semantic tone to an SVG shape's outline color.

import { stroke } from "@sdxc/u/color";

Quick reference

Every documented call, beside the CSS it emits.

Call	CSS
`u.stroke()`	`css({ stroke: "var(--ui-fg, CanvasText)" })`
`u.stroke("neutral.tint")`	`css({ stroke: "var(--ui-neutral-bg-tint)" })`
`u.stroke("brand")`	`css({ stroke: "var(--ui-brand-fg)" })`
`u.stroke("none")`	`css({ stroke: "none" })`

Every scale argument also takes a raw CSS value, which passes through untouched.

u.stroke()

Wrap the call in a state utility to scope it to one selector.

u.hover(u.stroke())

Wrap the call in a container query to scope it to one width.

u.at("md", u.stroke())

The custom properties this utility reads, which a theme redefines.

u.stroke(value?: ColorValue | (string & {}))