Skip to content

pantoken / plugins/pantoken/colors/src / onColor

Fall: onColor()

onColor(surface, threshold?): string

Beta

Lesanlegt forgrunnslit — svart eða hvítt — fyrir efni sem sett er á surface. Þetta er CSS-eina form InstUI's endurteknu *-on-color-afbrigða (aðdráttarrammi um brand-takka, texti í primary-inverse-takka, tákn á lituðu yfirborði): í stað fasts gagnstæðulitar tekur það andstæðuna frá yfirborðinu sjálfu, svo hún haldist rétt þegar yfirborðið breytist.

Það les ljósleika yfirborðsins í OKLCH í gegnum relative color-syntax og festir hann við 0 (svart) eða 1 (hvítt) við threshold með calc(… * infinity) clamp-bragðinu — engin JS, engin föst hex-gildi.

Færibreytur

surface

string

Bakgrunnsliturinn sem efnið situr á (beint, var(--token), eða innra hjálparyfirlit).

threshold?

number = 0.62

OKLCH ljósleiki (0–1) þar sem yfirborð telst "ljóst" (sjálfgefið 0.62).

Skilar

string

Yfirsegðarlýsing (oklch(from …)) sem leysist upp í svart eða hvítt.

Dæmi

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)"