ब्रांड पैलेट
Apothem के मुख्य ब्रांड रंग और सत्रह हार्नेस ब्रांड रंग। एकमात्र सत्य का स्रोत assets/design-tokens.css पर विहित डिज़ाइन टोकन हैं; साइट उन मानों को प्रतिबिंबित करती है।
मुख्य पैलेट
विहित पैलेट — slate तटस्थ रैंप, emerald एक्सेंट रैंप, और सिमेंटिक रंग —
assets/design-tokens.css
(और इसका assets/design-tokens.json दर्पण) पर डिज़ाइन टोकन के स्वामित्व में है।
site/app/global.css
पर साइट थीम उन टोकन मानों को उन CSS चरों में प्रतिबिंबित करती है जिन्हें Fumadocs थीम
उपभोग करती है। नीचे का प्रत्येक मान एक विहित रैंप चरण तक अनुरेखित होता है।
| भूमिका | टोकन (CSS) | लाइट मोड | डार्क मोड | उपयोग |
|---|---|---|---|---|
| प्राथमिक | --brand-text | slate-900 #0f172a | slate-50 #f8fafc | शीर्षक, नेविगेशन टेक्स्ट, प्राथमिक पठन सतहें। |
| एक्सेंट | --sl-color-accent | emerald-600 #059669 | emerald-400 #34d399 | सक्रिय लिंक, फ़ोकस रिंग, चयनित नेविगेशन। |
| मुख्य टेक्स्ट | --brand-muted | slate-600 #475066 | slate-300 #c2ccda | डिफ़ॉल्ट गद्य टेक्स्ट। |
| मुख्य पृष्ठभूमि | --brand-surface | white #ffffff | slate-900 #0f172a | डिफ़ॉल्ट पृष्ठभूमि। |
| नेविगेशन पृष्ठभूमि | --brand-surface-muted | slate-50 #f8fafc | slate-950 #080c15 | हेडर और नेविगेशन पट्टियाँ। |
| कोड पृष्ठभूमि | --brand-code-bg | slate-900 #0f172a | slate-950 #080c15 | इनलाइन / ब्लॉक कोड सतहें। |
हार्नेस पैलेट
हार्नेस रंग हार्नेस रंग पर रहते हैं। Apothem मार्क के
षट्भुज — इसके केंद्रीय नोड और टर्मिनस नोड — पर ज्यामितीय मैपिंग ब्रांड अनुभाग में मोड़ी गई
है।
site/app/global.css
पर CSS सत्य का स्रोत प्रत्येक टोकन को उसके CSS चर से जोड़ता है।
दस्तावेज़ीकरण में उपयोग
पैलेट वैश्विक स्टाइलशीट site/app/global.css के माध्यम से जुड़ी होती है, जिसे रूट लेआउट
द्वारा आयात किया जाता है। लाइट और डार्क मोड वेरिएंट थीम की .dark क्लास स्थिति के साथ
स्विच होते हैं।
अपडेट
पैलेट केवल तब अपडेट होती है जब कोई मुख्य रंग (slate / emerald) स्थानांतरित होता है या कोई
हार्नेस अपस्ट्रीम में ब्रांड-रंग परिवर्तन की पुष्टि करता है। प्रति-हार्नेस परिवर्तन
site/app/global.css, हार्नेस रंग, और assets/src/
के अंतर्गत प्रत्येक प्रभावित SVG मास्टर के पार परमाणविक रूप से प्रसारित होते हैं।
ब्रांड दिशानिर्देश
सुसंगत ब्रांड अनुप्रयोग के लिए Apothem ब्रांड नामकरण अनुशासन, लोगो वैरिएंट, रंग पैलेट और एसेट दिशानिर्देश।
हार्नेस ब्रांड रंग
Apothem प्रोजेक्ट वेबसाइट, Apothem मार्क, और हर आर्किटेक्चर डायग्राम में उपयोग की जाने वाली प्रति-हार्नेस ब्रांड-रंग पैलेट। एक सत्य का स्रोत — सत्रह ब्रांड रंग, एक apothem हब।