pantoken / plugins/pantoken/colors/src / onColor

Funkcija: onColor() ​

onColor(surface, threshold?): string

Beta

Berljiv sprednji načrt — črna ali bela — za vsebino, postavljeno na surface. To je izključno CSS različica ponavljajočih se *-on-color različic InstUI (obroč za fokus na gumbu znamke, besedilo primarno-inverznega gumba, ikona na obarvani površini): namesto fiksnega inverznega tokena, izbere kontrast iz same površine, tako da ostane pravilen, ko se površina spreminja.

Prebere svetlost površine v OKLCH prek sintakse relativnih barv in jo pri threshold privije na 0 (črna) ali 1 (bela) z uporabo trika calc(… * infinity) clamp — brez JS, brez fiksnega hex.

Parametri ​

surface ​

string

Barva ozadja, na kateri počiva vsebina (dobesedna, var(--token) ali gnezdena pomožna vrednost).

threshold? ​

number = 0.62

Svetlost OKLCH (0–1), nad katero se površina šteje za "svetlo" (privzeto 0.62).

Vrne ​

string

Izraz oklch(from …), ki se razreši v črno ali belo.

Primer ​

ts
onColor("var(--instui-color-background-brand)"); // white on a dark brand surface, black on a light one
// → "oklch(from var(--…-brand) clamp(0, (0.62 - l) * infinity, 1) 0 0)"