झालर
मुफ़्त, बिना साइन-अप, आपके ब्राउज़र में चलता है।
चौड़ाई भर नौ वृत्तीय चाप — वही क्लासिक झालरदार किनारा जो शामियानों, टिकटों और क़ीमत तालिकाओं पर दिखता है। आकृति चाप ही लाते हैं, इसलिए यह शैली यादृच्छिकता के स्लाइडर को पूरी तरह नज़रअंदाज़ करती है।
इसके पीछे की सेटिंग्स
| जनरेटर | वेव |
|---|---|
| बिंदु | 9 |
| आयाम | 48% |
| यादृच्छिकता | 0% |
| आधार रेखा | 55% |
| परतें | 1 |
| चिकनाहट | 100% |
| बीज | 300 |
जानने लायक़ बातें
- अनुमानित वक्रों के बजाय असली चाप, इसलिए हर उभार एक जैसा है।
- आयाम तय करता है कि झालरें कितनी गहरी हों — हल्की लहर से लेकर अर्धवृत्त तक।
- 382 बाइट पर यह तुलनीय बारीकी वाली चिकनी लहर से हल्का है।
बाइट में इसकी क़ीमत
यही आकृति SVG के रूप में 382 बाइट की है और CSS बैकग्राउंड के रूप में 543 बाइट की — data URI बड़ा इसलिए है कि प्रतिशत-एन्कोडिंग हर बचाए गए अक्षर के बदले तीन अक्षर लेती है। दोनों आँकड़े ऊपर दिखाई गई आकृति के हैं, निर्देशांकों में दो दशमलव की परिशुद्धता के साथ।
| प्रारूप | आकार |
|---|---|
| SVG | 382 B |
| CSS बैकग्राउंड | 543 B |
| CSS clip-path | 574 B |
झालर के SVG की शुरुआत
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320" preserveAspectRatio="none"><path d="M-160 176A80 52.53 0 0 1 0 176A80 52.53 0 0 1 160 176A80 52.53 0 0 1 320 176A80 52.53 0 0 1 480 176A80 52.53 0 0 1 640 176A80 52.53 0 0 1 800 176A80 52.53 0 0 1 960 176A80 52.53 0 0 1 1120 176A80 52.53 0 0 1 1280 176A80 5…और विस्तार से
इस शैली में यादृच्छिकता का स्लाइडर निष्क्रिय छोड़ने के बजाय छिपा दिया जाता है। झालरें अपनी नियमितता से ही परिभाषित होती हैं — शोर को चापों के सिरे हिलाने देने से उभार असंगत ऊँचाइयों पर आते, जो बनावट नहीं बल्कि रेंडरिंग की ख़राबी लगता, इसलिए जनरेटर बिंदुओं को आधार रेखा पर रखता है और काम चापों पर छोड़ देता है।
सवाल
झालर मिल जाने के बाद मैं इसे कैसे बदलूँ?
जनरेटर खोलिए, प्रीसेट पंक्ति में झालर पर क्लिक कीजिए, फिर जो चाहें खिसकाइए। प्रीसेट शुरुआत का बिंदु है, ताला नहीं — हर स्लाइडर चालू रहता है, और बीज वाला ख़ाना शब्द भी लेता है, अगर आप अपनी आकृति को संख्या देने के बजाय नाम देना चाहें।
क्या अगली बार भी यही दिखेगी?
हाँ, जब तक बीज वही है। यह बीज 300 है, 9 बिंदुओं के साथ। जनरेटर निर्धारणात्मक है, इसलिए ये सेटिंग्स किसी भी डिवाइस पर बिलकुल यही वक्र दोबारा बनाती हैं।
क्या मैं दूसरा रंग इस्तेमाल कर सकता हूँ?
हाँ — रंग निर्यात के समय लगता है, ज्यामिति में पक्का नहीं होता। ऊपर का पूर्वावलोकन उपकरण के डिफ़ॉल्ट रंग का है; जनरेटर में अपना चुन लीजिए और SVG, CSS बैकग्राउंड और clip-path तीनों उसी के साथ चलेंगे।
इस पेज का हर आँकड़ा और हर आकृति बिल्ड के समय जनरेटर चलाकर बनाई गई है, इसलिए यह उसी उपकरण का वर्णन करता है जिसे आप अभी इस्तेमाल करने वाले हैं, न कि उसके किसी पुराने रूप का।