दस्तावेज़ और संदर्भ

संपूर्ण API पैरामीटर संदर्भ, टेक्स्ट हाइलाइट गाइड, केवल-आइकन प्रदर्शन मोड

मूल सिंटैक्स

text पैरामीटर में {{...}} का उपयोग करके उन भागों को लपेटें जिन्हें आप हाइलाइट करना चाहते हैं। सभी हाइलाइट किए गए खंड एक ही शैली साझा करते हैं। सुझाव: आप ऊपर पाठ सामग्री इनपुट में सीधे {{...}} भी टाइप कर सकते हैं — सिस्टम स्वचालित रूप से हाइलाइट का पता लगाएगा और लागू करेगा।

# सिंटैक्स प्रारूप
?text=सामान्य पाठ{{हाइलाइट पाठ}}और सामान्य पाठ
&hlcolor=FF5733

पैरामीटर विवरण

hlcolor हाइलाइट रंग

हाइलाइट रंग सेट करता है। HEX प्रारूप (जैसे FF5733) या रंग नाम (जैसे red) का समर्थन करता है।

उदाहरण： ?text=Mock{{Img}}.Dev&hlcolor=FF5733

hlcolor2 हाइलाइट ग्रेडिएंट रंग 2

ग्रेडिएंट हाइलाइट के लिए दूसरा रंग सेट करता है। इसे सेट करने पर स्वचालित रूप से ग्रेडिएंट प्रभाव सक्षम हो जाता है, जिसमें hlcolor प्रारंभिक रंग के रूप में कार्य करता है।

उदाहरण： ?text={{Hello}}&hlcolor=EC4899&hlcolor2=8B5CF6

hlgradient हाइलाइट ग्रेडिएंट दिशा

ग्रेडिएंट दिशा सेट करता है। सेट न होने पर डिफ़ॉल्ट क्षैतिज होता है।

horizontal क्षैतिज (बाएं से दाएं) vertical लंबवत (ऊपर से नीचे) diagonal तिरछा (ऊपर-बाएं से नीचे-दाएं)

उदाहरण： ?text={{Hello}}&hlcolor=EC4899&hlcolor2=8B5CF6&hlgradient=vertical

hlfont हाइलाइट फ़ॉन्ट

हाइलाइट किए गए पाठ के लिए स्वतंत्र फ़ॉन्ट निर्दिष्ट करता है। मान फ़ॉन्ट फ़ाइल नाम है (.ttf एक्सटेंशन के बिना)।

उदाहरण： ?text={{Brand}}&hlfont=Poppins-Bold

hlbold हाइलाइट बोल्ड

हाइलाइट किए गए पाठ को बोल्ड बनाता है। मान: true या 1।

उदाहरण： ?text={{Important}}&hlbold=true

पूर्ण उदाहरण

उदाहरण 1：एकल रंग हाइलाइट

https://mockimg.dev/600x400.png?text=Mock{{Img}}.Dev&hlcolor=FF5733

प्रभाव:"MockImg.Dev" — Img लाल रंग में दिखाई देता है

उदाहरण 2：ग्रेडिएंट हाइलाइट

https://mockimg.dev/600x400.png?text={{Gradient}}&hlcolor=EC4899&hlcolor2=8B5CF6

प्रभाव: "Gradient" गुलाबी से बैंगनी क्षैतिज ग्रेडिएंट में दिखाई देता है

उदाहरण 3：कस्टम फ़ॉन्ट हाइलाइट

https://mockimg.dev/600x400.png?text={{MockImg}}&hlfont=Poppins-Bold&hlcolor=3B82F6

प्रभाव: "MockImg" Poppins-Bold फ़ॉन्ट में नीला दिखाई देता है

उदाहरण 4：बोल्ड हाइलाइट

https://mockimg.dev/600x400.png?text={{Important}}&hlbold=true&hlcolor=EF4444

प्रभाव: "Important" लाल और बोल्ड में दिखाई देता है

उदाहरण 5：संयुक्त (ग्रेडिएंट + फ़ॉन्ट + बोल्ड)

https://mockimg.dev/600x400.png?text={{Premium}}&hlcolor=FFD700&hlcolor2=FF6B6B&hlgradient=diagonal&hlfont=Montserrat-Bold

प्रभाव: "Premium" तिरछा ग्रेडिएंट (स्वर्ण से लाल) में Montserrat-Bold फ़ॉन्ट दिखाई देता है

उदाहरण 6：बहु-खंड हाइलाइट

https://mockimg.dev/600x400.png?text={{MockImg}}+和+{{占位图}}&hlcolor=3B82F6

प्रभाव: "MockImg" और प्लेसहोल्डर दोनों नीले रंग में दिखाई देते हैं (साझा हाइलाइट स्टाइल)

उदाहरण 7：CJK पाठ में हाइलाइट

https://mockimg.dev/600x400.png?text={{MockImg}}+占位图服务&hlcolor=10B981

प्रभाव: "MockImg" हरे रंग में दिखाई देता है, शेष पाठ डिफ़ॉल्ट रंग का उपयोग करता है

उदाहरण 8：गहरा थीम + हाइलाइट

https://mockimg.dev/600x400.png?theme=dark&text=Dark+{{Mode}}&hlcolor=FBBF24

प्रभाव: डार्क थीम में, "Mode" स्वर्ण हाइलाइट में दिखाई देता है

{{...}} मार्कर पाठ चौड़ाई गणना में गिने नहीं जाते और लेआउट को प्रभावित नहीं करते
नेस्टेड {{...}} मार्कर समर्थित नहीं हैं — आंतरिक मार्कर सादे पाठ के रूप में माने जाते हैं
सभी हाइलाइट किए गए खंड एक ही hl* शैली सेटिंग्स साझा करते हैं
हाइलाइटिंग सभी आउटपुट प्रारूपों (SVG, PNG, JPEG, WebP, AVIF आदि) के साथ काम करती है
हाइलाइट मार्कर बहु-पंक्ति पाठ में भी काम करते हैं (पंक्ति विराम के लिए \n का उपयोग करें)

ट्रिगर शर्तें

icon पैरामीटर प्रदान किया गया
कोई text पैरामीटर नहीं, या text खाली है

आइकन आकार नियम

स्वचालित: आइकन आकार = छवि के छोटे आयाम का 80% (न्यूनतम 24px, अधिकतम 90%)

कस्टम: स्वचालित गणना को ओवरराइड करने के लिए iconsize पैरामीटर का उपयोग करें

उदाहरण

ठोस रंग आइकन

https://mockimg.dev/600x400.png?icon=outline/heart&iconcolor=FF5733

प्रभाव: लाल रंग में हृदय आइकन स्वचालित रूप से बड़ा और केंद्रित

ग्रेडिएंट आइकन

https://mockimg.dev/600x400.png?icon=filled/star&iconcolor=FFD700&iconcolor2=FF6B6B&icongradient=diagonal

प्रभाव: स्वर्ण से लाल तिरछे ग्रेडिएंट के साथ तारा आइकन

पारदर्शी + आइकन

https://mockimg.dev/200x200.png?icon=outline/user&iconcolor=3B82F6&bg=transparent

प्रभाव: पारदर्शी पृष्ठभूमि पर उपयोगकर्ता आइकन — अवतार के लिए आदर्श

ग्रेडिएंट पृष्ठभूमि + गोल

https://mockimg.dev/600x400.png?icon=outline/heart&iconcolor=FFFFFF&gradient=horizontal&bgcolor2=EC4899&radius=20

प्रभाव: गुलाबी ग्रेडिएंट पृष्ठभूमि पर सफेद हृदय आइकन गोल किनारों के साथ

गहरा थीम + आइकन

https://mockimg.dev/600x400.png?icon=filled/star&iconcolor=FFD700&theme=dark

प्रभाव: गहरी पृष्ठभूमि पर स्वर्ण तारा आइकन

गोलाकार बॉर्डर (अवतार)

https://mockimg.dev/400x400.png?icon=outline/user&iconcolor=3B82F6&radius=200&border=4&bordercolor=3B82F6

प्रभाव: बॉर्डर के साथ वृत्त में उपयोगकर्ता आइकन — अवतार प्लेसहोल्डर के लिए आदर्श

आइकन+पाठ बनाम केवल-आइकन

मोड	URL	प्रभाव
केवल-आइकन (बिना पाठ)	`?icon=outline/heart`	आइकन स्वचालित रूप से बड़ा और केंद्रित, बिना पाठ
आइकन + खाली पाठ	`?icon=outline/heart&text=`	केवल-आइकन के समान
आइकन + पाठ	`?icon=outline/heart&text=Love`	आइकन और पाठ एक साथ (मूल व्यवहार)
बिना आइकन बिना पाठ	`600x400.png`	आयाम पाठ (डिफ़ॉल्ट व्यवहार)

सभी आउटपुट प्रारूपों (SVG, PNG, JPEG, WebP, AVIF आदि) के साथ काम करता है
सभी आइकन पैरामीटर (iconcolor, iconcolor2, icongradient, iconsize) अपेक्षित रूप से काम करते हैं
सभी पृष्ठभूमि प्रभाव (पारदर्शी, ग्रेडिएंट, पैटर्न, नॉइज़, बॉर्डर, रेडियस) केवल-आइकन मोड के साथ संयोजित किए जा सकते हैं
छोटे आकारों के साथ भी काम करता है — फेविकन के लिए आदर्श: 32x32.ico?icon=filled/star&iconcolor=FFD700

अवलोकन

padding पैरामीटर प्लेसहोल्डर इमेज में टेक्स्ट और आइकन के चारों ओर सफेद स्थान को नियंत्रित करता है। 4 प्रारूपों का समर्थन: एकल पिक्सेल, एकल अनुपात, दो मान (लंबवत + क्षैतिज), चार मान (CSS दक्षिणावर्त)।

# समर्थित प्रारूप
?padding=20
?padding=1/6
?padding=10,20
?padding=10,20,30,40

डिफ़ॉल्ट व्यवहार

padding पैरामीटर के बिना, अंतर्निहित डिफ़ॉल्ट का उपयोग होता है (पिछले संस्करणों जैसा):

बाएं और दाएं: चौड़ाई का 5% ऊपर और नीचे: ऊंचाई का 20%

प्रारूप विवरण

20 एकल पिक्सेल मान

चारों तरफ समान पिक्सेल मान।

padding=20

1/6 एकल अनुपात मान

चारों तरफ अनुपात। ऊपर/नीचे ऊंचाई पर आधारित, बाएं/दाएं चौड़ाई पर। परिणाम स्वतः गोल।

padding=1/6 → 600×400 → ऊपर/नीचे 67px, बाएं/दाएं 100px

10,20 दो मान (लंबवत + क्षैतिज)

लंबवत और क्षैतिज पैडिंग अलग से नियंत्रित। पिक्सेल और अनुपात मिश्रित कर सकते हैं।

padding=10,20 → ऊपर/नीचे 10px, बाएं/दाएं 20px
padding=1/8,15 → ऊपर/नीचे = ऊंचाई/8, बाएं/दाएं 15px
padding=30,1/10 → ऊपर/नीचे 30px, बाएं/दाएं = चौड़ाई/10

10,20,30,40 चार मान (CSS दक्षिणावर्त)

CSS स्टाइल स्वतंत्र नियंत्रण: ऊपर, दाएं, नीचे, बाएं। ऊपर/नीचे ऊंचाई पर, बाएं/दाएं चौड़ाई पर। पिक्सेल-अनुपात मिश्रण संभव।

padding=10,20,30,40 → ऊपर 10, दाएं 20, नीचे 30, बाएं 40 (सब px)
padding=1/8,1/6,15,1/10 → ऊपर h/8, दाएं w/6, नीचे 15px, बाएं w/10 (मिश्रित)

उदाहरण

छोटा टेक्स्ट — पैडिंग कम करें

https://mockimg.dev/480x200.svg?text=IP&bold=true&padding=1/10

"IP" जैसे छोटे टेक्स्ट के लिए padding=1/10 से कॉम्पैक्ट लेआउट।

शून्य पैडिंग

https://mockimg.dev/600x400.svg?text=Full&padding=0

padding=0 सेट करें ताकि कंटेंट पूरी इमेज भरे।

आइकन + टेक्स्ट — कॉम्पैक्ट लेआउट

https://mockimg.dev/600x400.svg?icon=outline/heart&text=Love&padding=1/8

आइकन और टेक्स्ट साथ-साथ, मध्यम पैडिंग।

शीर्षक क्षेत्र — ऊपर बड़ा पैडिंग

https://mockimg.dev/600x300.svg?text=Title&padding=40,10,5,10

ऊपर बड़ा पैडिंग शीर्षक क्षेत्र का अहसास, नीचे कॉम्पैक्ट।

बायाँ नेविगेशन — बाएं बड़ा पैडिंग

https://mockimg.dev/800x400.svg?text=Content&padding=20,10,20,60

बाएं बड़ा पैडिंग नेविगेशन बार के लिए।

अनुपात मानों में अंश और हर सकारात्मक होने चाहिए
पिक्सेल मान ऋणात्मक नहीं हो सकते — ऋणात्मक मान स्वतः 0 हो जाएंगे
अनुपात परिणाम स्वतः पूर्ण पिक्सेल में गोल होते हैं
यदि पैडिंग इमेज आयामों के आधे से अधिक है, तो कंटेंट क्षेत्र बहुत छोटा हो सकता है और फ़ॉन्ट आकार स्वतः न्यूनतम 12px हो जाएगा

उन्नत सुविधाएँ — इंटरैक्टिव API डिबगर

आइकन प्रणाली

दस्तावेज़ और संदर्भ

मूल सिंटैक्स

पैरामीटर विवरण

पूर्ण उदाहरण

टिप्पणियाँ

ट्रिगर शर्तें

आइकन आकार नियम

उदाहरण

आइकन+पाठ बनाम केवल-आइकन

टिप्पणियाँ

अवलोकन

डिफ़ॉल्ट व्यवहार

प्रारूप विवरण

उदाहरण

टिप्पणियाँ