कलर पैलेट जेनरेटर
एक बेस रंग चुनें और तुरंत हल्के से गहरे रंग तक का एक स्मूद पैलेट पाएं, जो आपके डिज़ाइन सिस्टम में कॉपी करने के लिए तैयार है।
🔒 आपके ब्राउज़र में लोकली प्रोसेस किया गया
Loading…
इस्तेमाल कैसे करें
- "बेस रंग" फ़ील्ड में एक हेक्स कलर कोड टाइप करें, या नज़र से एक रंग चुनने के लिए कलर स्वैच पिकर पर क्लिक करें।
- जैसे ही कोई मान्य रंग पहचाना जाता है, इसके नीचे शेड्स का एक पूरा पैलेट अपने आप दिखाई देता है — दबाने के लिए कोई बटन नहीं है।
- पैलेट एक बहुत हल्के टिंट से लेकर एक बहुत गहरे शेड तक होता है, जो सभी आपके बेस रंग के समान ह्यू शेयर करते हैं।
- किसी भी स्वैच पर क्लिक करके उसका हेक्स कोड अपने क्लिपबोर्ड पर कॉपी करें — एक संक्षिप्त "कॉपी हो गया!" पुष्टि आपको बताती है कि यह काम कर गया।
विशेषताएं
- किसी भी बेस रंग से एक स्मूद 9-चरणों वाला हल्के से गहरे रंग तक का शेड स्केल जेनरेट करता है
- हर शेड में समान ह्यू और सैचुरेशन बनाए रखता है, ठीक Tailwind के अपने कलर स्केल्स की तरह
- आपके सटीक बेस रंग को पैलेट में शामिल करता है, न कि सिर्फ़ एक अनुमान को
- किसी भी स्वैच के हेक्स कोड के लिए एक-क्लिक कॉपी
- 100% क्लाइंट-साइड — आपके रंग कभी भी आपके ब्राउज़र से बाहर नहीं जाते
अक्सर पूछे जाने वाले सवाल
क्या यह टूल मेरा रंग कहीं भेजता है?
नहीं। पूरा पैलेट सीधे आपके ब्राउज़र में सामान्य JavaScript गणित से जेनरेट होता है — कुछ भी कभी अपलोड या सर्वर पर नहीं भेजा जाता।
शेड्स की गणना कैसे की जाती है?
टूल आपके बेस रंग को HSL में बदलता है, फिर ह्यू और सैचुरेशन को स्थिर रखते हुए लाइटनेस को बहुत हल्के से बहुत गहरे तक समान रूप से बदलता है। आपका सटीक बेस रंग स्केल के बीच में रखा जाता है।
क्या मैं इन पैलेट्स को Tailwind या अन्य डिज़ाइन सिस्टम में इस्तेमाल कर सकता हूं?
हां। यह पैलेट Tailwind के 50/100/.../900 कलर स्केल्स जैसे ही विचार का पालन करता है — एक ह्यू का हल्के से गहरे तक का रैंप — इसलिए आप हेक्स कोड सीधे अपनी थीम या CSS वैरिएबल्स में कॉपी कर सकते हैं।
मैं कौन से रंग फ़ॉर्मेट दर्ज कर सकता हूं?
केवल हेक्स कोड, शुरुआती # के साथ या बिना, या तो 3-अंकों का शॉर्टहैंड (जैसे #abc) या 6-अंकों का (जैसे #3b82f6)। अगर आप नज़र से चुनना चाहें तो कलर पिकर का इस्तेमाल करें।
मुझे एरर मैसेज क्यों दिख रहा है?
आपने जो टेक्स्ट टाइप किया वह किसी पहचाने गए हेक्स कलर फ़ॉर्मेट से मेल नहीं खाता। सुनिश्चित करें कि यह #3b82f6 (या 3b82f6, या शॉर्टहैंड #abc) जैसा दिखे।