Skip to content

pantoken / plugins/pantoken/colors/src / overlayColors

함수: overlayColors()

overlayColors(base, overlay, percent?): string

베타

불투명한 base 위에 overlay을(percent% 강도로) 평탄화합니다 — CSS 전용 대체물로 ui-color-utils overlayColors를 대신합니다. 해당 헬퍼는 두 개의 RGBA 색상을 소스-오버로 합성하여 하나의 불투명한 결과를 만듭니다; 일반적인 경우(반투명 틴트가 단단한 표면 위에 놓인 경우)는 정확히 두 색의 color-mix()입니다. 일반적인 RGBA-over-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))"