कच्चा Base64, पूरा डेटा URI, HTML इमेज एलिमेंट या इस्तेमाल के लिए तैयार CSS बैकग्राउंड घोषणा कॉपी करें।
इमेज से Base64
PNG, JPG, WebP, GIF और SVG इमेज को सीधे अपने ब्राउज़र में Base64 के रूप में एन्कोड करें।
इमेज से Base64
इमेज अपलोड किए बिना उन्हें Base64 में बदलें
इमेज को कच्ची Base64 स्ट्रिंग, पूरे डेटा URI, HTML इमेज टैग या CSS बैकग्राउंड मान के रूप में एन्कोड करें। प्रोसेसिंग आपके ब्राउज़र में स्थानीय रूप से होती है।
स्रोत फ़ाइल की एन्कोड किए गए परिणाम से तुलना करें और उसे इनलाइन उपयोग करने से पहले आकार में हुई सटीक वृद्धि देखें।
आपकी स्रोत इमेज और तैयार Base64 डेटा ब्राउज़र मेमोरी में रहते हैं और रूपांतरण के लिए अपलोड नहीं किए जाते।
एन्कोड करने के लिए इमेज अपलोड करें
खींचकर छोड़ें, क्लिपबोर्ड से पेस्ट करें या अपने डिवाइस से इमेज चुनें
इमेज कॉपी करें और Ctrl+V या Command+V दबाएँ आपके ब्राउज़र में स्थानीय रूप से प्रोसेस किया गया- फ़ाइल का नाम
- फ़ाइल का प्रकार
- आयाम
- मूल आकार
- अनुमानित Base64 आकार
Base64 आउटपुट मूल फ़ाइल से लगभग 33% बड़ा होता है और उसे ब्राउज़र मेमोरी की काफ़ी आवश्यकता हो सकती है।
इमेज को आपके ब्राउज़र में स्थानीय रूप से पढ़ा और एन्कोड किया जा रहा है…
अपने प्रोजेक्ट के लिए आवश्यक फ़ॉर्मेट चुनें और तैयार टेक्स्ट को कॉपी या डाउनलोड करें।
इमेज को आपके ब्राउज़र में स्थानीय रूप से पढ़ा और एन्कोड किया जा रहा है…
एन्कोडिंग आकार सारांश
- स्रोत फ़ाइल
- Base64 स्ट्रिंग
- पूरा डेटा URI
- आकार में वृद्धि
- मूल आकार का :percent%
Base64 सामान्यतः लगभग 33% आकार बढ़ाता है क्योंकि प्रत्येक तीन स्रोत बाइट को चार टेक्स्ट अक्षरों से दर्शाया जाता है।
बड़ी Base64 इमेज HTML या CSS का आकार बढ़ाती हैं, स्वतंत्र रूप से कैश नहीं की जा सकतीं और पेज रेंडरिंग में देरी कर सकती हैं।
एन्कोडिंग ब्राउज़र मेमोरी में JavaScript द्वारा की जाती है। इमेज और तैयार आउटपुट CyberTools के किसी रूपांतरण एंडपॉइंट पर नहीं भेजे जाते।
Base64 एक उलटने योग्य टेक्स्ट एन्कोडिंग है। यह आकार बदलने, दोबारा कंप्रेस करने या गुणवत्ता बदलने के बिना मूल फ़ाइल बाइट सुरक्षित रखता है।
इनलाइन Base64 बहुत छोटे संसाधनों के लिए सबसे उपयोगी है। कैशिंग और लेज़ी लोडिंग का लाभ लेने वाली बड़ी इमेज के लिए बाहरी फ़ाइलें सामान्यतः बेहतर होती हैं।
इमेज से Base64: वेब में इनलाइन उपयोग के लिए इमेज एन्कोड करें
PNG, JPG, JPEG, WebP, GIF या SVG इमेज को सीधे अपने ब्राउज़र में Base64 टेक्स्ट में बदलें। यह टूल कच्ची Base64 स्ट्रिंग, पूरा डेटा URI, HTML इमेज उदाहरण और CSS बैकग्राउंड उदाहरण तैयार करता है।
इमेज स्थानीय रूप से प्रोसेस होती है और किसी रूपांतरण सर्वर पर अपलोड नहीं की जाती। आप एन्कोड किए गए सटीक आकार को देख सकते हैं, उसकी स्रोत फ़ाइल से तुलना कर सकते हैं और केवल अपने प्रोजेक्ट के लिए आवश्यक आउटपुट कॉपी कर सकते हैं।
इस्तेमाल के लिए तैयार कोड
प्रीफ़िक्स, MIME प्रकार या मार्कअप स्वयं बनाए बिना कच्चा Base64, डेटा URI, HTML और CSS आउटपुट तैयार करें।
आकार की लागत समझें
वेब पेज में परिणाम जोड़ने से पहले Base64 से बने सटीक अक्षर और प्रतिशत वृद्धि देखें।
केवल ब्राउज़र में प्रोसेसिंग
पूरे रूपांतरण के दौरान निजी डिज़ाइन, आंतरिक स्क्रीनशॉट और क्लाइंट संसाधन अपने डिवाइस पर रखें।
इमेज से Base64 टूल क्या करता है
एन्कोडर इमेज के बाइनरी बाइट पढ़ता है और उन्हें Base64 वर्णमाला से दर्शाता है। इससे ऐसा टेक्स्ट मान बनता है जिसे मूल बाइनरी डेटा को खराब किए बिना HTML, CSS, JSON, XML, ईमेल और अन्य टेक्स्ट-आधारित फ़ॉर्मेट में इस्तेमाल किया जा सकता है।
चार आउटपुट दिए जाते हैं: कच्चे Base64 अक्षर, MIME प्रकार वाला पूरा डेटा URI, HTML img एलिमेंट और CSS background-image उदाहरण। आप मैन्युअल रूप से कोड बनाए बिना अपने एप्लिकेशन के लिए आवश्यक संस्करण कॉपी कर सकते हैं।
इमेज को Base64 में कैसे एन्कोड करें
PNG, JPG, JPEG, WebP, GIF या SVG फ़ाइल चुनें, उसे अपलोड क्षेत्र में खींचकर छोड़ें या क्लिपबोर्ड से इमेज पेस्ट करें। फ़ाइल की जानकारी और पूर्वावलोकन देखें, आवश्यकता होने पर सत्यापन पूरा करें और एन्कोडिंग शुरू करें।
रूपांतरण के बाद मूल और एन्कोड किए गए आकार की तुलना करें। कच्चा Base64, डेटा URI, HTML या CSS चुनें, फिर आउटपुट कॉपी करें या टेक्स्ट फ़ाइल के रूप में डाउनलोड करें। दूसरी इमेज प्रोसेस करने से पहले टूल रीसेट करें।
Base64 एन्कोडिंग कैसे काम करती है
बाइनरी फ़ाइलों में 0 से 255 तक के बाइट मान होते हैं, जिनमें ऐसे मान भी शामिल हैं जिन्हें दृश्य टेक्स्ट के रूप में सुरक्षित तरीके से नहीं दिखाया जा सकता। Base64 इनपुट को तीन बाइट के समूहों में बाँटता है और हर समूह को 64-अक्षर वाली वर्णमाला से चुने गए चार प्रिंट योग्य ASCII अक्षरों में बदलता है।
यह प्रक्रिया निश्चित और दोषरहित है। Base64 स्ट्रिंग को डिकोड करने पर वही स्रोत बाइट दोबारा बनते हैं। जब इनपुट की लंबाई तीन से पूरी तरह विभाजित नहीं होती, तो अंतिम समूह में पैडिंग अक्षर जोड़े जा सकते हैं।
Base64 आउटपुट लगभग 33% बड़ा क्यों होता है
स्रोत डेटा के हर तीन बाइट चार Base64 अक्षर बनते हैं। चार-से-तीन का यह अनुपात एन्कोड किए गए टेक्स्ट को आमतौर पर मूल फ़ाइल से लगभग एक-तिहाई बड़ा बनाता है, जबकि पैडिंग और डेटा URI प्रीफ़िक्स से थोड़ा अतिरिक्त अंतर आता है।
30 KB की इमेज से लगभग 40 KB के Base64 अक्षर बनते हैं। यह वृद्धि एन्कोडिंग विधि का हिस्सा है और किसी अलग प्रतिनिधित्व को चुने या स्रोत फ़ाइल को पहले छोटा किए बिना हटाई नहीं जा सकती।
Base64 डेटा URI को समझना
कच्ची Base64 स्ट्रिंग फ़ाइल प्रकार की पहचान नहीं करती। डेटा URI एन्कोड किए गए अक्षरों से पहले data: प्रीफ़िक्स, इमेज MIME प्रकार और ;base64 मार्कर जोड़ता है। इसके बाद ब्राउज़र पूरे मान को इनलाइन इमेज URL की तरह इस्तेमाल कर सकता है।
डेटा URI को HTML img के src एट्रिब्यूट, CSS background-image मान या URL स्वीकार करने वाले किसी अन्य संदर्भ में रखा जा सकता है। तैयार उदाहरणों में चुनी गई फ़ाइल से लिया गया सही MIME प्रकार शामिल होता है।
इनलाइन Base64 इमेज कब उपयोगी होती हैं
Base64 छोटे इंटरफ़ेस आइकन, लोडिंग इंडिकेटर, ईमेल संसाधन, पोर्टेबल रिपोर्ट, टेस्ट फ़िक्स्चर और स्वयं-पूर्ण HTML फ़ाइलों के लिए उपयोगी हो सकता है। इन मामलों में अलग इमेज अनुरोध हटाना या सब कुछ एक दस्तावेज़ में रखना लाभदायक हो सकता है।
जब किसी संसाधन को JSON या किसी अन्य केवल-टेक्स्ट पेलोड में भेजना हो, तब भी यह उपयोगी है। Vite और webpack जैसे बिल्ड टूल अक्सर कॉन्फ़िगर की गई आकार सीमा से छोटी फ़ाइलों को स्वचालित रूप से इनलाइन करते हैं।
बाहरी इमेज कब बेहतर विकल्प है
बड़ी तस्वीरें, हीरो इमेज, बार-बार इस्तेमाल होने वाले आइकन और पेज के निचले हिस्से की मीडिया सामान्यतः बाहरी फ़ाइलों के रूप में बेहतर काम करती हैं। बाहरी इमेज स्वतंत्र रूप से कैश, समानांतर रूप से फ़ेच, डिलीवरी इंफ्रास्ट्रक्चर द्वारा कंप्रेस और आवश्यकता होने पर लेज़ी लोड की जा सकती हैं।
इनलाइन Base64 इमेज HTML या CSS फ़ाइल का हिस्सा बन जाती है। इससे पार्सिंग का काम बढ़ता है, इमेज को अलग से कैश नहीं किया जा सकता और उसे रखने वाला दस्तावेज़ बदलने पर पूरी इमेज दोबारा डाउनलोड होती है।
गोपनीयता और संवेदनशील इमेज
Base64 एन्कोडिंग है, एन्क्रिप्शन नहीं। आउटपुट पाने वाला कोई भी व्यक्ति उसे डिकोड करके मूल इमेज प्राप्त कर सकता है। गोपनीय दृश्य जानकारी छिपाने के लिए Base64 स्ट्रिंग पर भरोसा न करें।
यह टूल ब्राउज़र मेमोरी में स्थानीय रूप से एन्कोडिंग करता है और इमेज को CyberTools के किसी रूपांतरण एंडपॉइंट पर नहीं भेजता। स्थानीय प्रोसेसिंग आंतरिक आरेख, क्लाइंट संसाधन, निजी स्क्रीनशॉट और गोपनीयता आवश्यकताओं वाली फ़ाइलों के लिए उपयोगी है।
SVG और एनिमेटेड GIF से जुड़ी बातें
एनिमेटेड GIF एनिमेटेड ही रहता है क्योंकि Base64 सभी एनीमेशन फ़्रेम सहित हर बाइट को सुरक्षित रखता है। समर्थित HTML इमेज एलिमेंट में इस्तेमाल होने पर तैयार डेटा URI मूल GIF की तरह व्यवहार करता है।
SVG पहले से ही टेक्स्ट-आधारित XML फ़ॉर्मेट है। सीधे इनलाइन SVG मार्कअप अक्सर छोटा होता है और अलग-अलग एलिमेंट पर स्टाइल या स्क्रिप्ट लगाने देता है। Base64-एन्कोडेड SVG मुख्यतः वहाँ उपयोगी है जहाँ URL मान आवश्यक हो, जैसे CSS बैकग्राउंड।
आधुनिक वेब प्रोजेक्ट में Base64 का उपयोग
React, Vue और अन्य फ्रेमवर्क इमेज एट्रिब्यूट या स्टाइल बाइंडिंग में डेटा URI इस्तेमाल कर सकते हैं। छोटे एकबारगी संसाधनों के लिए यह सुविधाजनक है, लेकिन बड़ी इमेज को सामान्यतः फ़ाइल के रूप में इम्पोर्ट करना चाहिए ताकि बिल्ड सिस्टम नाम, कैशिंग और डिलीवरी को बेहतर बना सके।
कई बंडलर कॉन्फ़िगर की जा सकने वाली इनलाइन सीमाएँ देते हैं। सीमा से छोटे संसाधन डेटा URI बनते हैं जबकि बड़ी फ़ाइलें अलग से तैयार होती हैं। इससे अनुरोध ओवरहेड, Base64 आकार वृद्धि और कैश व्यवहार के बीच संतुलन बनता है।
एन्कोडर द्वारा तैयार किए गए आउटपुट
| आउटपुट | इसमें क्या होता है |
|---|---|
| कच्ची Base64 स्ट्रिंग | केवल एन्कोड किए गए अक्षर, MIME प्रकार या डेटा URI प्रीफ़िक्स के बिना। |
| Base64 डेटा URI | इनलाइन URL के रूप में उपयोग के लिए पूरा data:[mime-type];base64,[content] मान। |
| HTML उपयोग उदाहरण | एक img एलिमेंट जिसके src एट्रिब्यूट में तैयार डेटा URI होता है। |
| CSS उपयोग उदाहरण | तैयार डेटा URI वाली background-image घोषणा। |
इमेज से Base64 एन्कोडिंग के सामान्य उपयोग
- अतिरिक्त इमेज अनुरोध के बिना छोटा आइकन इनलाइन करना
- ऑफ़लाइन काम करने वाला स्वयं-पूर्ण HTML दस्तावेज़ बनाना
- JSON या XML पेलोड में इमेज शामिल करना
- HTML ईमेल टेम्पलेट के लिए इनलाइन इमेज बनाना
- छोटी बैकग्राउंड इमेज सीधे CSS में जोड़ना
- डेवलपमेंट और डीबगिंग के लिए पोर्टेबल टेस्ट डेटा तैयार करना
- फ्रंटएंड बिल्ड पाइपलाइन का आउटपुट सत्यापित करना
- केवल-टेक्स्ट फ़ील्ड के माध्यम से बाइनरी इमेज बाइट भेजना
Base64 इमेज का उपयोग कब नहीं करना चाहिए
- बड़ी तस्वीरें या हीरो इमेज
- लेज़ी लोड होने वाली इमेज
- कई पेज पर दोबारा इस्तेमाल किए जाने वाले संसाधन
- स्वतंत्र ब्राउज़र कैश से लाभ लेने वाली फ़ाइलें
- बड़ी इमेज वाला बार-बार बदलने वाला HTML या CSS
- CDN से कुशलतापूर्वक दी जाने वाली इमेज
इमेज से Base64 एन्कोडर की विशेषताएँ
| विशेषता | विवरण |
|---|---|
| स्वीकृत फ़ॉर्मेट | PNG, JPG, JPEG, WebP, GIF और SVG |
| ब्राउज़र में अधिकतम फ़ाइल आकार | 200 MB, उपलब्ध ब्राउज़र और डिवाइस मेमोरी के अधीन |
| इनपुट तरीके | फ़ाइल चयन, खींचकर छोड़ना या क्लिपबोर्ड से पेस्ट करना |
| तैयार आउटपुट | कच्चा Base64, पूरा डेटा URI, HTML उदाहरण और CSS उदाहरण |
| एन्कोडिंग व्यवहार | आकार बदले या दोबारा कंप्रेस किए बिना दोषरहित बाइट-से-टेक्स्ट रूपांतरण |
| एनिमेटेड GIF समर्थन | एन्कोड किए गए आउटपुट में एनीमेशन बाइट सुरक्षित रहते हैं |
| अपेक्षित आकार वृद्धि | लगभग 33%, साथ में छोटा डेटा URI प्रीफ़िक्स |
| प्रोसेसिंग स्थान | रूपांतरण के लिए इमेज अपलोड किए बिना स्थानीय ब्राउज़र मेमोरी |
इमेज से Base64 के अक्सर पूछे जाने वाले प्रश्न
Base64 स्ट्रिंग मूल इमेज से लंबी क्यों होती है?
Base64 हर तीन स्रोत बाइट को चार टेक्स्ट अक्षरों से दर्शाता है। इसलिए तैयार स्ट्रिंग सामान्यतः लगभग 33% बड़ी होती है, साथ ही पैडिंग और डेटा URI प्रीफ़िक्स से थोड़ा अतिरिक्त आकार जुड़ता है।
क्या Base64 एन्कोडिंग इमेज की गुणवत्ता कम करती है?
नहीं। Base64 दोषरहित है और मूल फ़ाइल बाइट सुरक्षित रखता है। यह इमेज का आकार नहीं बदलता, उसे दोबारा कंप्रेस नहीं करता और दृश्य गुणवत्ता नहीं बदलता।
क्या Base64 डेटा URI को सीधे ब्राउज़र में खोल सकता हूँ?
हाँ। एन्कोड किए गए परिणाम की तुरंत जाँच करने के लिए मान्य इमेज डेटा URI को ब्राउज़र के एड्रेस बार में पेस्ट करें या उसे इमेज स्रोत के रूप में सेट करें।
क्या एनिमेटेड GIF सुरक्षित रहते हैं?
हाँ। GIF फ़ाइल के सभी बाइट, जिनमें एनीमेशन फ़्रेम और समय संबंधी डेटा शामिल हैं, एन्कोड किए जाते हैं। एनिमेटेड GIF समर्थित संदर्भों में परिणाम एनिमेटेड रहता है।
क्या React या Vue में Base64 इमेज इस्तेमाल करनी चाहिए?
बहुत छोटे संसाधनों के लिए Base64 उपयोगी हो सकता है। बड़ी इमेज को सामान्यतः फ़ाइल के रूप में इम्पोर्ट करना चाहिए ताकि फ्रेमवर्क या बंडलर कैशिंग, फ़ाइल नाम और डिलीवरी को अनुकूलित कर सके।
क्या SVG इमेज को Base64 में एन्कोड करना चाहिए?
केवल तब जब URL मान आवश्यक हो। HTML के लिए सीधे इनलाइन SVG मार्कअप अक्सर छोटा होता है और CSS या JavaScript को अलग-अलग SVG एलिमेंट तक पहुँचने देता है।
क्या Base64 एन्क्रिप्शन का सुरक्षित रूप है?
नहीं। Base64 उलटने योग्य एन्कोडिंग है और कोई गोपनीयता प्रदान नहीं करता। स्ट्रिंग पाने वाला कोई भी व्यक्ति मूल इमेज दोबारा बना सकता है।
क्या रूपांतरण के दौरान मेरी इमेज अपलोड होती है?
नहीं। JavaScript आपके ब्राउज़र में स्थानीय रूप से इमेज पढ़ता और एन्कोड करता है तथा उसे CyberTools के किसी इमेज रूपांतरण एंडपॉइंट पर नहीं भेजता।
संपर्क
कुछ कमी है?
किसी गायब टूल का अनुरोध करें या हमारे संपर्क फ़ॉर्म के माध्यम से अपनी प्रतिक्रिया भेजें।
हमसे संपर्क करें