किसी भी फोटो से एक सुंदर ग्रेडिएंट निकालें — इमेज ड्रॉप करें, मूड चुनें, और प्रमुख रंग ड्रैगेबल ग्रेडिएंट स्टॉप बन जाएंगे। पेस्ट-रेडी CSS तुरंत कॉपी करें।

यहाँ एक इमेज ड्रैग और ड्रॉप करें

या ब्राउज़ करने के लिए क्लिक करें — आप अपने क्लिपबोर्ड से भी पेस्ट कर सकते हैं

सब कुछ आपके ब्राउज़र में चलता है — आपकी इमेज कभी अपलोड नहीं होती, कोई साइन-अप नहीं, बिल्कुल फ्री।

सोर्स इमेज
रंग पढ़ रहे हैं…
सोर्स इमेज
मूड
निकाले गए रंग
ये आपकी इमेज से निकाले गए प्रमुख रंग हैं। एक स्वॉच कॉपी करने के लिए क्लिक करें, या ग्रेडिएंट फाइन-ट्यून करने के लिए नीचे स्टॉप ड्रैग करें।
ग्रेडिएंट प्रीव्यू
ग्रेडिएंट टाइप
एंगल
°
कलर स्टॉप्स
एक स्टॉप रिपोज़िशन करने के लिए हैंडल ड्रैग करें, या एक जोड़ने के लिए बार क्लिक करें। इसका रंग एडिट करने के लिए स्टॉप चुनें।
चुना गया स्टॉप
%
CSS
background: ;

Gradient Generator from Image के बारे में

इमेज से ग्रेडिएंट जनरेटर किसी भी फोटो को एक तैयार-इस्तेमाल CSS ग्रेडिएंट में बदल देता है। एक इमेज ड्रॉप, ब्राउज़ या पेस्ट करें और यह टूल इसे कैनवस पर पढ़ता है, इसके प्रमुख रंग निकालता है और उन्हें ग्रेडिएंट स्टॉप के रूप में सजाता है जिन्हें आप तब तक खींच, फिर से रंग और पुनर्व्यवस्थित कर सकते हैं जब तक ब्लेंड मूल तस्वीर के भाव से मेल न खा जाए।

एक मूड सेलेक्टर — Colorful, Bright, Muted, Deep या Dark — बदलता है कि निकाले गए कौन से रंग स्टॉप बनते हैं, इसलिए एक ही फोटो कई बहुत अलग ग्रेडिएंट दे सकती है। आप ग्रेडिएंट टाइप (linear, radial या conic), कोण, और स्वयं स्टॉप को नियंत्रित करते हैं: एक जोड़ने के लिए बार पर क्लिक करें, फिर से स्थान देने के लिए खींचें, एक क्लिक में उलटें या घुमाएं।

पूरी प्रक्रिया आपके ब्राउज़र में चलती है; आपकी इमेज कभी सर्वर पर अपलोड नहीं होती। जब प्रीव्यू सही लगे, तो पूरा CSS नियम, सिर्फ बैकग्राउंड मान, या निकाले गए रंगों को अकेले कॉपी करें — हीरो सेक्शन, पेज बैकग्राउंड और फोटोग्राफी से बने ब्रांड विज़ुअल के लिए आदर्श।

Gradient Generator from Image का उपयोग कैसे करें

  1. एक इमेज खींचकर छोड़ें, क्लिक करके ब्राउज़ करें, या अपने क्लिपबोर्ड से पेस्ट करें।
  2. एक मूड चुनें — Colorful, Bright, Muted, Deep या Dark — यह तय करने के लिए कि निकाले गए कौन से रंग स्टॉप बनेंगे।
  3. ग्रेडिएंट टाइप चुनें (linear, radial या conic) और कोण समायोजित करें।
  4. ब्लेंड को फाइन-ट्यून करने के लिए कलर स्टॉप खींचें; ज़रूरत पड़ने पर स्टॉप जोड़ें, हटाएं, उलटें या फेरबदल करें।
  5. तैयार-टू-पेस्ट ग्रेडिएंट कोड लेने के लिए "Copy CSS" पर क्लिक करें।

अक्सर पूछे जाने वाले प्रश्न

नहीं। इमेज सीधे आपके ब्राउज़र में एक कैनवस में पढ़ी जाती है, और रंग निष्कर्षण व ग्रेडिएंट गणित सभी स्थानीय रूप से होते हैं। किसी भी बिंदु पर कुछ भी आपके डिवाइस से बाहर नहीं जाता।

हां, पूरी तरह। क्योंकि सब कुछ क्लाइंट-साइड चलता है इसलिए कोई क्रेडिट, अकाउंट या सीमा नहीं है — जितनी चाहें उतनी इमेज से ग्रेडिएंट निकालें।

यह टूल एक फोटो से शुरू होता है: यह इमेज के प्रमुख रंग निकालता है और उनसे ग्रेडिएंट बनाता है। नियमित Gradient Generator आपके खुद चुने रंगों के साथ शून्य से शुरू होता है। दोनों एक ही तरह का संपादन-योग्य, कॉपी-रेडी CSS देते हैं।

मूड आपकी इमेज से निकाले गए रंगों को फिर से रैंक करते हैं: Colorful चटख विविध रंगत को प्राथमिकता देता है, Bright हल्के संतृप्त टोन चुनता है, Muted नरम कम-संतृप्त रंग चुनता है, और Deep व Dark समृद्ध, गहरे रंग खींचते हैं। मूड बदलने पर ग्रेडिएंट स्टॉप तुरंत फिर से बनते हैं।

हां। हर स्टॉप खींचने योग्य है, आप स्टॉप जोड़ने या चुने हुए हटाने के लिए बार पर क्लिक कर सकते हैं, किसी भी स्टॉप का रंग बदल सकते हैं, linear, radial और conic के बीच स्विच कर सकते हैं, कोण को 45° चरणों में घुमा सकते हैं, दिशा उलट सकते हैं, या इमेज से नए रंगों में फेरबदल कर सकते हैं।

इसे साझा करें

लोकप्रिय खोजें
इमेज से ग्रेडिएंट फोटो से ग्रेडिएंट निकालें इमेज से css ग्रेडिएंट फोटो ग्रेडिएंट जनरेटर तस्वीर से ग्रेडिएंट बनाएं फोटो से css ग्रेडिएंट
मदद चाहिए?
इस टूल में कोई समस्या मिली? हमारी टीम को बताएं।
समस्या की रिपोर्ट करें

इस मुफ़्त टूल को अपनी वेबसाइट पर जोड़ें — नीचे दिया गया कोड कॉपी और पेस्ट करें।