pantoken / plugins/pantoken/colors/src / overlayColors

Fonction: overlayColors() ​

overlayColors(base, overlay, percent?): string

Bêta

Aplatir overlay (à percent% d'intensité) sur une base opaque — un substitut uniquement CSS pour ui-color-utils overlayColors. Cet utilitaire combine en mode source-over deux couleurs RGBA en une seule couleur opaque ; le cas courant (une teinte translucide sur une surface solide) est exactement une color-mix() à deux couleurs. Le compositing général RGBA sur RGBA ne peut pas être une seule couleur CSS, donc ceci couvre seulement le cas de base opaque.

Paramètres ​

base ​

string

La couleur d'arrière-plan opaque.

overlay ​

string

La couleur appliquée par-dessus.

percent? ​

number = 50

Quelle proportion de overlay est visible, 0–100 (par défaut 50).

Retourne ​

string

Une expression color-mix().

Exemple ​

ts
overlayColors("var(--surface)", "var(--brand)", 12);
// "color-mix(in srgb, var(--brand) 12%, var(--surface))"