मोफत प्लेसहोल्डर इमेज जनरेटर

हे कसे कार्य करते

सर्वकाही HTML Canvas API आणि गराज-लिहिलेली SVG markup वापरून तुमच्या ब्राउझरमध्ये होते — सर्व्हर, अपलोड, थर्ड-पार्टी सेवा नाही. तुम्ही परिमाणे, रंग, आणि लेबल मजकूर सेट करता, आणि साधन रिअल टाइममध्ये इमेज थेट canvas घटकावर रंगवते, नंतर हवे तेव्हा PNG, JPEG, किंवा SVG मध्ये सीरियलाइझ करते.

1. 1
   परिमाणे आणि रंग कॉन्फिगर करा

   रुंदी व उंची (प्रत्येकी 1–4000 px) टाइप करा, किंवा सामान्य social media व design आकार व्यापणाऱ्या अकरा प्रीसेट्सपैकी एक निवडा. बिल्ट-इन थीम्समधून पार्श्वभूमी व मजकूर रंग निवडा किंवा कोणतेही hex मूल्य थेट टाका; native color picker आणि प्रमाणित मजकूर फील्ड सिंकमध्ये राहतात.
2. 2
   Canvas API प्रिव्ह्यू तात्काळ रेंडर करते

   एक React effect प्रत्येक बदलावर drawPlaceholder() कॉल करतो. हे फंक्शन CanvasRenderingContext2D वापरून आयत पार्श्वभूमी रंगाने भरते, पर्यायाने 15% opacity वर फिकट कर्णरेषा काढते, नंतर तुमचा लेबल मजकूर मोजते व center-align करते — canvas रुंदीच्या 90% मध्ये बसेपर्यंत फॉन्ट आपोआप लहान करत.
3. 3
   PNG, JPEG, किंवा SVG म्हणून एक्सपोर्ट करा

   PNG आणि JPEG डाउनलोड्स canvas.toDataURL() कॉल करतात, base64 निकाल मेमरीत Blob मध्ये रूपांतरित करतात, आणि डाउनलोड सुरू करतात — iOS Safari च्या डाउनलोड नियमांची पूर्तता व्हावी यासाठी सर्व वापरकर्ता-हावभावाच्या आत सिंक्रोनसली. SVG एक्सपोर्ट जुळणाऱ्या rect, पर्यायी कर्णरेषा, आणि मजकूर घटकासह self-contained SVG स्ट्रिंग तयार करतो, नंतर तो .svg फाइल म्हणून सेव्ह करतो.
4. 4
   बॅच एक्सपोर्ट आणि कॉपी शॉर्टकट्स

   'सर्व प्रीसेट्स डाउनलोड करा' बटण गतिशीलपणे JSZip आयात करतो, अकरा प्रीसेट आकारांपैकी प्रत्येक तोच draw फंक्शन वापरून off-screen canvas वर पुन्हा-रेंडर करतो, आणि सर्व PNGs एकल ZIP मध्ये पॅकेज करतो. Copy बटणे कोडमध्ये तात्काळ पेस्ट करण्यासाठी PNG data URL, inline SVG img tag, किंवा CSS background-image declaration देतात.

संबंधित साधने