Skip to content

pantoken / plugins/pantoken/colors/src / onColor

Fungsi: onColor()

onColor(surface, threshold?): string

Beta

Foreground yang terbaca — hitam atau putih — untuk konten yang ditempatkan pada surface. Ini adalah bentuk hanya-CSS dari varian *-on-color InstUI yang berulang (cincin fokus pada tombol brand, teks tombol primary-inverse, ikon pada permukaan berwarna): alih-alih token inverse tetap, ia memilih kontras dari permukaan itu sendiri, sehingga tetap benar saat permukaan berubah.

Ia membaca kecerahan OKLCH permukaan melalui sintaks warna relatif dan menyesuaikannya ke 0 (hitam) atau 1 (putih) pada threshold menggunakan trik clamp calc(… * infinity) — tanpa JS, tanpa hex tetap.

Parameter

surface

string

Warna latar yang menjadi dasar konten (literal, var(--token), atau pembantu bersarang).

threshold?

number = 0.62

Kecerahan OKLCH (0–1) di atas mana permukaan dihitung sebagai "terang" (default 0.62).

Mengembalikan

string

Sebuah ekspresi oklch(from …) yang menyelesaikan ke hitam atau putih.

Contoh

ts
onColor("var(--instui-color-background-brand)"); // white on a dark brand surface, black on a light one
// → "oklch(from var(--…-brand) clamp(0, (0.62 - l) * infinity, 1) 0 0)"