Skip to content

pantoken / plugins/pantoken/colors/src / overlayColors

Função: overlayColors()

overlayColors(base, overlay, percent?): string

Beta

Aplainar overlay (em percent% de intensidade) sobre um base opaco — um substituto apenas em CSS para ui-color-utils overlayColors. Esse helper compõe duas cores RGBA em cima uma da outra em um único resultado opaco; o caso comum (uma tonalidade translúcida sobre uma superfície sólida) é exatamente uma composição de duas cores color-mix(). A composição geral RGBA sobre RGBA não pode ser uma única cor CSS, então isto cobre apenas o caso de base opaca.

Parâmetros

base

string

A cor de fundo opaca.

overlay

string

A cor aplicada sobre ela.

percent?

number = 50

Quanto de overlay aparece, 0–100 (padrão 50).

Retorna

string

Uma expressão color-mix().

Exemplo

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