Skip to content

pantoken / plugins/pantoken/colors/src / overlayColors

Συνάρτηση: overlayColors()

overlayColors(base, overlay, percent?): string

Βήτα

Ισοπεδώστε το overlay (με ισχύ percent%) πάνω σε ένα αδιαφανές base — αντικατάσταση μόνο με CSS για ui-color-utils overlayColors. Αυτό το helper κάνει source-over σύνθεση δύο χρωμάτων RGBA σε ένα αδιαφανές αποτέλεσμα· η συνήθης περίπτωση (μια ημιδιαφανής απόχρωση πάνω σε μια στερεή επιφάνεια) είναι ακριβώς ένα δίχρωμο color-mix(). Η γενική σύνθεση RGBA πάνω σε RGBA δεν μπορεί να είναι ένα ενιαίο χρώμα CSS, οπότε αυτό καλύπτει μόνο την περίπτωση με αδιαφανή βάση.

Παράμετροι

base

string

Το αδιαφανές χρώμα φόντου.

overlay

string

Το χρώμα που τοποθετείται από πάνω.

percent?

number = 50

Πόσο από το overlay φαίνεται, 0–100 (προεπιλογή 50).

Επιστρέφει

string

Μια έκφραση color-mix().

Παράδειγμα

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