🌈Tailwind रंग जनरेशन

Tailwind क 50सँ950 क अर्थ

Tailwind CSS क रंगमे, 50 सबसँ हल्का आ 950 सबसँ गहरा होइत अछि, ई 11 स्तर केर संख्या चमककेँ दर्शबैत अछि, आ 500 ओहि रंग केर आधार होइत अछि। संख्याकेँ 'bg-primary-500' या 'text-primary-700' जकाँ क्लास नाम केर अंतमे जोड़ल जाइत अछि।

• 50सँ300 धरिक स्तर：50सँ300 धरिक स्तर पृष्ठभूमि रंग या हल्का भराबमे बेसी प्रयोग होयबाक हल्का रंग अछि, जाहि पर गहरा अक्षर रखलासँ सेहो पढ़बामे आसान होइत अछि।
• 600सँ950 धरिक स्तर：600सँ950 धरिक स्तर बटन केर होवर समय या शीर्षक केर अक्षर रंगमे बेसी प्रयोग होयबाक गहरा रंग अछि, जे उज्जर पृष्ठभूमि पर सेहो साफ देखाइत अछि।

v3 आ v4 मे रंग परिभाषित करबाक तरीकाक अंतर

Tailwind CSS क v3 मे रंगकेँ tailwind.config.js क JavaScript मे परिभाषित कएल जाइत अछि, आ v4 मे CSS फाइलक @theme क भीतर CSS वेरिएबलक रूपमे परिभाषित कएल जाइत अछि। दुनू लेखन-शैलीमे, परिभाषित रंग 'bg-primary-500' जकाँ एकही क्लास नामसँ प्रयोग कएल जा सकैत अछि।

• v3 केर लेखन-शैली：v3 केर लेखन-शैली theme.extend.colors क भीतर 'primary: { 500: '#3B82F6' }' जकाँ रंग-नाम आ स्तरकेँ नेस्ट कऽ लिखबाक फॉर्मेट अछि।
• v4 केर लेखन-शैली：v4 केर लेखन-शैली @theme क भीतर '--color-primary-500: #3B82F6;' जकाँ रंग-नाम आ स्तरकेँ हाइफनसँ जोड़ल वेरिएबल नामसँ लिखबाक फॉर्मेट अछि।