pantoken / plugins/pantoken/colors/src / onColor

फंक्शन: onColor() ​

onColor(surface, threshold?): string

बीटा

पठनयोग्य फोरग्राउंड — काला या सफ़ेद — वह सामग्री जिसको surface पर रखा जाता है। यह InstUI के आवर्ती *-on-color वेरिएंट्स (ब्रांड बटन पर फोकस रिंग, प्राइमरी‑इनवर्स बटन का टेक्स्ट, रंगीन सतह पर आइकन) का केवल CSS रूप है: एक निश्चित इनवर्स टोकन की बजाय यह सतह से ही कंट्रास्ट चुनता है, इसलिए सतह बदलने पर भी यह सही रहता है।

यह सापेक्ष रंग सिन्टेक्स के माध्यम से सतह की OKLCH लाइटनेस पढ़ता है और threshold पर calc(… * infinity) क्लैम्प ट्रिक का उपयोग करके इसे 0 (काला) या 1 (सफेद) में स्नैप कर देता है — कोई JS नहीं, कोई स्थिर हेक्स नहीं।

पैरामीटर ​

surface ​

string

वह पृष्ठभूमि रंग जिस पर सामग्री स्थित होती है (शाब्दिक, var(--token), या एक नेस्टेड हेल्पर)।

threshold? ​

number = 0.62

OKLCH लाइटनेस (0–1) जिसकी ऊपर सतह को “लाइट” माना जाता है (डिफ़ॉल्ट 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)"