इमेज से CSS ग्रेडिएंट
कोई फ़ोटो या चित्र इंपोर्ट करें: उसके प्रमुख रंग निकालकर अपने-आप कॉपी करने के लिए तैयार CSS ग्रेडिएंट linear-gradient में जोड़ दिए जाते हैं। प्रोसेसिंग आपके ब्राउज़र में 100% लोकल है (WebAssembly) — आपकी इमेज कभी किसी सर्वर पर नहीं भेजी जाती।
यह कैसे काम करता है
किसी फ़ोटो के रंगों का माहौल सेक्शन बैकग्राउंड, बैनर या प्रोडक्ट कार्ड के लिए इस्तेमाल करना, इमेज को खुद दोहराए बिना: यह टूल ठीक यही करता है। यह इंपोर्ट की गई इमेज के पिक्सेल का विश्लेषण करके सबसे ज़्यादा मौजूद रंग निकालता है, फिर उन्हें क्रम से जोड़कर एक लीनियर ग्रेडिएंट बनाता है, जिसका एंगल आप अंतिम CSS प्रॉपर्टी कॉपी करने से पहले बदल सकते हैं।
क्या ग्रेडिएंट में रंगों का वही क्रम रहता है जो इमेज में है?
रंग स्रोत इमेज में सबसे ज़्यादा से सबसे कम बार आने के क्रम में रखे जाते हैं, और ग्रेडिएंट उन्हें उसी क्रम में जोड़ता है। अगर नतीजा विज़ुअली पसंद न आए, तो आप कोड कॉपी करके अपनी स्टाइलशीट में रंगों का क्रम हाथ से बदल सकते हैं।
साफ़-सुथरे नतीजे के लिए कितने रंग चुनें?
दो या तीन रंग आम तौर पर पठनीय और सुरुचिपूर्ण ग्रेडिएंट देते हैं, जो सामान्य सेक्शन बैकग्राउंड जैसा लगता है। चार से ज़्यादा रंगों पर नतीजा हल्के ग्रेडिएंट की जगह इंद्रधनुष जैसा हो सकता है, जिसे जानबूझकर गहरे इफ़ेक्ट के लिए रखें।
गोपनीयता: रंग निकालना और CSS बनाना पूरी तरह WebAssembly के ज़रिए आपके ब्राउज़र में होता है, आपकी इमेज किसी सर्वर पर अपलोड नहीं होती।