pantoken-root / plugins/pantoken/colors/src / onColor

تابع: onColor() ​

onColor(surface, threshold?): string

بتا

رنگ متن خوانا — سیاه یا سفید — برای محتوایی که روی surface قرار می‌گیرد. این فرم فقط-CSS از واریانت‌های مکرر *-on-color در InstUI است (حلقه فوکوس روی دکمه برند، متن دکمهٔ primary-inverse، آیکون روی سطح رنگی): به‌جای یک توکن معکوس ثابت، تضاد را از خودِ سطح می‌گیرد تا هنگام تغییر سطح همواره صحیح بماند.

روشنایی OKLCH سطح را از طریق نحو رنگ نسبی می‌خواند و آن را در 0 (سیاه) یا 1 (سفید) در threshold با ترفند clampِ calc(… * infinity) قرار می‌دهد — بدون JS و بدون هگز ثابت.

پارامترها ​

surface ​

string

رنگ پس‌زمینهٔ محتوایی که روی آن قرار می‌گیرد (صِرفاً مقدار، var(--token)، یا یک helper تو در تو).

threshold? ​

number = 0.62

آستانهٔ روشنایی OKLCH (۰–۱) که بالاتر از آن سطح را «روشن» محسوب می‌کند (پیش‌فرض 0.62).

مقدار بازگشتی ​

string

یک عبارت oklch(from …) که به سیاه یا سفید حل می‌شود.

نمونه ​

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