Skip to content

pantoken / plugins/pantoken/colors/src / overlayColors

Funktion: overlayColors()

overlayColors(base, overlay, percent?): string

Beta

Flatten overlay (bei percent% Stärke) über eine undurchsichtige base — ein nur mit CSS realisierter Ersatz für ui-color-utils overlayColors. Dieser Helfer führt ein Source-over-Kompositing von zwei RGBA-Farben zu einem undurchsichtigen Ergebnis durch; der häufige Fall (ein transluzenter Farbton über einer festen Oberfläche) ist genau ein Zwei-Farben- color-mix(). Allgemeines RGBA-über-RGBA-Kompositing kann nicht als einzige CSS-Farbe dargestellt werden, daher deckt dies nur den Fall mit undurchsichtiger Basis ab.

Parameter

base

string

Die undurchsichtige Hintergrundfarbe.

overlay

string

Die darüber gelegte Farbe.

percent?

number = 50

Wie viel von overlay durchscheint, 0–100 (Standard 50).

Rückgabe

string

Ein color-mix()-Ausdruck.

Beispiel

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