एक छवि खींचें या चयन करने के लिए क्लिक करें
PNG, JPEG, GIF, WebP, SVG, BMP
यह कैसे काम करता है
यह किसी छवि को Data URI के रूप (data:image/…;base64,…) में Base64 स्ट्रिंग में बदल देता है, जिसे आप किसी अलग फ़ाइल या अतिरिक्त HTTP अनुरोध के बिना सीधे HTML या CSS में एम्बेड कर सकते हैं।
परिणाम मूल फ़ाइल से लगभग 33% अधिक जगह लेता है, इसलिए इसे छोटी छवियों के लिए रखना उचित है: आइकन, लोगो, पैटर्न या प्लेसहोल्डर।
डिकोडिंग मोड में यह एक Base64 स्ट्रिंग या पूर्ण Data URI स्वीकार करता है, इसके पहले बाइट से छवि का प्रकार पहचानता है और डाउनलोड करने योग्य पूर्वावलोकन दिखाता है।
उदाहरण
logo.pngdata:image/png;base64,iVBORw0KGgoAAAANSUhEUgAA…data:image/png;base64, उपसर्ग प्रकार दर्शाता है। हर एन्कोड किया गया PNG iVBORw0KGgo से शुरू होता है, जो उसके फ़ाइल सिग्नेचर से मेल खाता है।background-image: url("data:image/png;base64,iVBORw0KGgo…");Data URI को किसी बाहरी फ़ाइल के बिना छवि एम्बेड करने के लिए किसी CSS नियम के भीतर जैसा है वैसा उपयोग किया जा सकता है।उपयोग के मामले
- data URI के माध्यम से छोटे आइकन या लोगो को CSS/HTML में एम्बेड करना, अतिरिक्त अनुरोधों से बचते हुए।
- किसी छवि को JSON, कॉन्फ़िगरेशन फ़ाइल या डेटाबेस के भीतर संग्रहीत करना।
- केवल टेक्स्ट स्वीकार करने वाले API या ईमेल (MIME) के माध्यम से छवियाँ भेजना।
- किसी Base64 स्ट्रिंग या Data URI से किसी छवि को पुनर्प्राप्त करना और पूर्वावलोकन करना।
अक्सर पूछे जाने वाले प्रश्न
क्या सभी छवियों को Base64 में बदलना उचित है?
नहीं। यह आकार लगभग 33% बढ़ाता है और ब्राउज़र छवि को अलग से कैश नहीं कर सकता। यह छोटी छवियों के लिए आदर्श है, पर बड़ी के लिए लगभग हमेशा अलग फ़ाइल बेहतर होती है।
यह किन छवि फ़ॉर्मैट का समर्थन करता है?
एन्कोड करते समय कोई भी (PNG, JPEG, GIF, WebP, BMP, SVG)। डिकोड करते समय यह फ़ाइल के पहले बाइट से प्रकार को स्वतः पहचान लेता है।
मेरा Data URI इतना लंबा क्यों है?
क्योंकि Base64 प्रत्येक 3 बाइट को 4 वर्णों से दर्शाता है, इसलिए टेक्स्ट मूल बाइनरी की तुलना में लगभग 33% बढ़ जाता है। यह सामान्य है, खासकर छवियों में।
क्या मेरी छवि किसी सर्वर पर अपलोड होती है?
नहीं। छवि पूरी तरह आपके ब्राउज़र में पढ़ी और एन्कोड की जाती है; यह कभी आपके कंप्यूटर से बाहर नहीं जाती।