pantoken / plugins/pantoken/colors/src / onColor

פונקציה: onColor()

onColor(surface, threshold?): string

בטא

הגופן הקריא — שחור או לבן — עבור תוכן שמוצב על surface. זו הצורה התלויה ב‑CSS בלבד של וריאנטי *-on-color החוזרים של InstUI (טבעת מיקוד על כפתור המותג, טקסט של כפתור ראשי־הפוך, אייקון על משטח בצבע): במקום טוקן הפוך קבוע, הוא בוחר את הניגודיות מתוך המשטח עצמו, כך שהיא תישאר נכונה כאשר המשטח משתנה.

הוא קורא את בהירות ה‑OKLCH של המשטח דרך תחביר צבע יחסי ומיישר אותה ל־0 (שחור) או 1 (לבן) ב־threshold באמצעות טריק ה‑calc(… * infinity) clamp — ללא JS, ללא hex קבוע.

פרמטרים

surface

string

הצבע של הרקע שעליו יושב התוכן (ממשי, var(--token) או עזר מקונן).

threshold?

number = 0.62

בהירות OKLCH (0–1) מעליה המשטח נחשב "בהיר" (ברירת מחדל 0.62).

מחזיר

string

ביטוי oklch(from …) שמתפרש לשחור או לבן.

דוגמה

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)"