> [Site index](https://perfectvector.com/llms.txt) — available pages and descriptions.

# शैडो बॉक्स SVG: जुड़ी कागज़ लेयर बनाएँ

> समान फ़्रेम, जुड़ी कागज़ आकृतियों और जाँचे स्टैक क्रम वाला शैडो-बॉक्स SVG बनाएँ। देखें अलग चाँद सहेजी ज्यामिति कैसे बदलता है।

Source: https://perfectvector.com/hi/blog/shadow-box-svg-connected-layers

Language: hi
Author: Irene Kim
Published: 2026-10-08T08:00:00+09:00
Updated: 2026-10-08T08:00:00+09:00

शैडो बॉक्स का लेयर वाला SVG बनाने के लिए हर गहराई लेयर को जुड़ा पैनल बनाएँ: फ़्रेम, उस गहराई का आर्टवर्क और इच्छित कागज़ को साथ रखने की पर्याप्त जोड़-ज्यामिति। हर पैनल के बाहरी आयाम समान रखें, ओवरलैप होती सामग्री आकृतियाँ जोड़ें, फिर देखें सामने के पैनल क्या छिपाते हैं।

यह गाइड तीन पैनल के पहाड़ी दृश्य से SVG डिज़ाइन और फ़ाइल तैयारी दिखाती है। हमने सहेजे कंटूर जाँचे और ब्राउज़र में रेंडर किए। फ़ाइलें Cricut Design Space में आयात नहीं कीं और कागज़ नहीं काटा, इसलिए पुल की मज़बूती, सामग्री सेटिंग और वास्तविक संयोजन का परीक्षण बाकी है।

## तय करें कि कागज़ के हर पैनल पर क्या होगा

**गहराई लेयर** वह पैनल है जो दूसरे के सामने या पीछे रखा है। रंग स्क्रीन पर पहचानने में मदद कर सकता है, लेकिन पैनल का काम उसकी स्थिति और आकृति से आता है। PNG को रंग से बाँटना ये संबंध तय नहीं करता। विनाइल या सपाट रंग परतों के लिए अलग [Cricut लेयर वाले SVG की गाइड](https://perfectvector.com/hi/blog/layered-svg-for-cricut) लें।

**पॉज़िटिव सामग्री** वह कागज़ है जो रखना है। **कटआउट** हटाया जाने वाला छेद है। **पुल** पॉज़िटिव सामग्री की पट्टी है जो किसी विवरण को बाकी पैनल से जोड़ती है। **तैरता द्वीप** बची सामग्री है जिसका उस पैनल से कोई जोड़ नहीं।

नीचे के उदाहरण में पीछे के पैनल में पहाड़ और चाँद हैं। बीच में पेड़ और ज़मीन हैं। सामने निचला टीला है। हर पैनल का बाहरी फ़्रेम है और हर बचा विवरण उससे जुड़ता है।

**सहेजा SVG डिज़ाइन उदाहरण**

![तीन जुड़े 200 mm SVG पैनल, अलग चाँद वाला विपरीत उदाहरण और उनका संरेखित सपाट स्टैक का ब्राउज़र रेंडर](https://perfectvector.com/blog/shadow-box-svg-connected-layers/connected-panels.webp)

*तीनों पैनल में एक-एक जुड़ा पॉज़िटिव क्षेत्र है। अलग चाँद वाले रूप में दो हैं। सपाट स्टैक दिखाता है कि कौन-सी आकृतियाँ दूसरों को ढकती हैं; वह कागज़ की मज़बूती या वास्तविक गहराई का सिमुलेशन नहीं।*

## समान बाहरी सीमा वाली तीन लेयर बनाएँ

आकृति घटाने और जोड़ने वाला वेक्टर एडिटर, सरल चित्र और इच्छित फ़्रेम के माप चाहिए। आकृतियाँ जोड़ने से पहले संपादन योग्य मास्टर रखें। उपयोगी वेक्टर आर्टवर्क हो तो उससे शुरू करें। चित्र केवल PNG या JPG में हो तो पहले पाथ पाएँ, फिर कागज़ के जोड़ अलग डिज़ाइन करें।

### 1. एक फ़्रेम बनाकर कॉपी करें

फ़्रेम के अंदर पैनलों के लिए उपलब्ध जगह मापें। अंतिम प्रोजेक्ट आकार चुनने से पहले बैकिंग और तय स्पेसर की जगह का ध्यान रखें।

हमारी फ़ाइलों में **200 × 200 mm** बाहरी वर्ग और **12 mm फ़्रेम पट्टी** है। खुला हिस्सा x = 12 से 188 mm और y = 12 से 188 mm तक है। ये उदाहरण आयाम हैं, हर फ़्रेम के लिए सुझाया फिट नहीं।

बाहरी वर्ग और बीच में छोटा वर्ग बनाएँ। छेद बनाने के लिए छोटा वर्ग घटाएँ, फिर तीन पैनलों के लिए फ़्रेम कॉपी करें। Inkscape में **Difference** घटाव है और **Union** चुने पाथ की साझा बाहरी सीमा रखता है। Difference में क्रम मायने रखता है: घटाई जाने वाली आकृति रखी जाने वाली के ऊपर होती है। [Inkscape बूलियन ऑपरेशन](https://inkscape-manuals.readthedocs.io/en/latest/boolean-operations.html)

हर लेयर में समान पेज मूल-बिंदु और बाहरी वर्ग रखें। हर निर्यात को उसके अलग चित्र तक क्रॉप न करें। सभी उदाहरण `width="200mm"`, `height="200mm"` और `viewBox="0 0 200 200"` बताते हैं; सहेजी ज्यामिति की वही 200 mm सीमा है। SVG का `viewBox` व्यूपोर्ट में मैप निर्देशांक आयत तय करता है। गंतव्य ऐप में भौतिक आयाम फिर पुष्ट करें। [W3C SVG निर्देशांक तंत्र](https://www.w3.org/TR/SVG2/coords.html#ViewBoxAttribute)

### 2. पीछे का दृश्य फ़्रेम से जोड़ें

पहाड़ की सिलुएट ऐसी रखें कि उसकी जड़ नीचे की फ़्रेम पट्टी से ओवरलैप हो। ऊपर चाँद जोड़ें। खुली जगह में अकेला चाँद बचाए कागज़ का अलग टुकड़ा है, इसलिए पीछे का पैनल एक टुकड़ा रखना हो तो स्पष्ट जोड़ चाहिए।

हमारे उदाहरण में चाँद का केंद्र **x = 145, y = 46 mm** और नाममात्र त्रिज्या **14 mm** है। **x = 143 से 147 mm** का लंबवत आयत उसे ऊपरी फ़्रेम से जोड़ता है। Union से पहले आयत चाँद और फ़्रेम दोनों को ओवरलैप करता है।

फ़्रेम, पहाड़, चाँद और पुल Union करें। बनी रूपरेखा जाँचें। मूल ऑब्जेक्ट के बीच की ओवरलैप सीमाएँ हटनी चाहिए; वे अतिरिक्त अंदरूनी कट कंटूर न रहें।

उदाहरण का पुल **4 mm चौड़ा** है। यह संख्या जाँची फ़ाइल बताती है। यह आपके कागज़, फैलाव, मशीन या अंतिम आकार की न्यूनतम चौड़ाई नहीं। इच्छित सामग्री और ज्यामिति से छोटा परीक्षण करें।

### 3. बीच का विषय आधार से जोड़ें

पेड़ की छतरी, तना और ज़मीन जुड़े रखें। यहाँ तना **8 mm चौड़ा** है, x = 56 से 64 mm तक। वह छतरी और ज़मीन को ओवरलैप करता है, ज़मीन नीचे की फ़्रेम पट्टी को। आकृतियों को बीच के पैनल में Union करें।

आँख, तारा या अक्षर का काउंटर बदल सकता है कि कौन-से क्षेत्र जुड़े रहें। सरल करने से पहले इन विवरणों को पॉज़िटिव सामग्री या कटआउट की तरह देखें। निर्यात के बाद छेद अचानक भरे तो [SVG छेद और fill-rule निदान](https://perfectvector.com/hi/blog/svg-holes-fill-in) लें।

### 4. सामने का हिस्सा विषय दिखाने जितना नीचे रखें

तीसरे फ़्रेम में नीचा टीला जोड़कर नीचे की पट्टी में मिलाएँ। तीनों पैनल संरेखित करें, पहाड़ पेड़ के पीछे और टीला सामने हो।

**ओक्लूज़न** का मतलब देखने की दिशा से एक आकृति दूसरी को छिपाती है। हमारे सपाट स्टैक में पेड़ पहाड़ का कुछ भाग ढकता है और टीला पेड़ की जड़। चाँद दिखता रहता है। टीला पेड़ की छतरी या इच्छित मुख्य विवरण छिपाए तो निर्यात से पहले उसे नीचे करें या विषय खिसकाएँ।

स्क्रीन स्टैक दिखाई देने वाली आकृतियों का संबंध जाँचता है। स्पेसर मोटाई, देखने का कोण, रोशनी और फ़्रेम में उपलब्ध गहराई के लिए भौतिक मॉडल चाहिए।

## सहेजे SVG में सामग्री के जोड़ देखें

एक पाथ एलिमेंट में अनेक असंबद्ध आकृतियाँ हो सकती हैं। **पाथ गिनना जुड़े होने का परीक्षण नहीं।** कंपाउंड पाथ में एक पाथ ऑब्जेक्ट के भीतर कई कंटूर होते हैं; फ़िल नियम तय करता है कौन-से घिरे क्षेत्र भरें। SVG विनिर्देश में हमारे उपयोग वाला `evenodd` सहित ये नियम हैं। [W3C SVG फ़िल और फ़िल नियम](https://www.w3.org/TR/SVG2/painting.html#FillRuleProperty)

हमने उदाहरण पैनलों के पॉज़िटिव क्षेत्र Union किए, बंद कंटूर निर्यात किए और सहेजे SVG डेटा से भरे क्षेत्र फिर बनाए। इससे असली निर्यातित ज्यामिति जाँची, केवल ओवरलैप रंगीन आकृतियों का ढेर नहीं।

| सहेजी फ़ाइल            | जुड़े पॉज़िटिव क्षेत्र | जाँच क्या बताती है                        |
| ---------------------- | ---------------------- | ----------------------------------------- |
| पीछे: पहाड़, चाँद, पुल | 1                      | पुल से चाँद फ़्रेम जुड़ता है              |
| बीच: पेड़ और ज़मीन     | 1                      | छतरी, तना, ज़मीन और फ़्रेम एक क्षेत्र हैं |
| सामने: नीचा टीला       | 1                      | टीला फ़्रेम से जुड़ता है                  |
| पीछे, पुल हटाकर        | 2                      | चाँद अलग पॉज़िटिव द्वीप है                |

चारों फ़ाइलों में एक पाथ एलिमेंट है। जुड़े पैनलों में दो-दो बंद कंटूर हैं: बाहरी सीमा और छेद की सीमा। तैरते चाँद वाले संस्करण में अलग चाँद का तीसरा कंटूर है। इसीलिए केवल लेयर नाम, समूह या पाथ संख्या नहीं बता सकते कि इच्छित शीट जुड़ी रहती है या नहीं।

अपने निर्यात में:

1. सहेजा SVG फिर खोलें और हर पैनल साधारण फ़िल के साथ अकेला देखें।
2. हर विवरण से फ़्रेम तक बची सामग्री में लगातार मार्ग खोजें। जहाँ आकृतियाँ लगभग मिलें वहाँ ज़ूम करें; बिंदु-स्पर्श कागज़ की मापने योग्य पट्टी नहीं देता।
3. जुड़े ऑब्जेक्ट के आसपास कंटूर जाँचें। रखी सामग्री बाँटने वाली ओवरलैप जोड़-रेखाएँ मिलाएँ।
4. छेद ज्यामिति की तरह देखें। दूसरी आकृति पर रंगा सफ़ेद आकार नीचे का कंटूर हटाए बिना छेद जैसा लग सकता है।
5. साझा मूल-बिंदु और आयाम से सहेजी लेयर का सपाट प्रीव्यू फिर बनाएँ।

विवरण अलग रहे तो पुल जोड़कर Union करें, जुड़े हिस्से पर खिसकाएँ, कटआउट बनाएँ या अलग चिपकने वाला टुकड़ा रखें। संयोजन योजना में यह चुनाव स्पष्ट रखें।

## चित्र रास्टर हो तो PerfectVector कहाँ काम आता है

PerfectVector उपयुक्त PNG या JPG से संपादन योग्य SVG पाथ वापस पा सकता है। उसका [SVG for Cricut कार्यप्रवाह](https://perfectvector.com/svg-for-cricut) गंतव्य फ़ाइल से पहले आकृतियाँ देखने और रंग सुधारने देता है। फिर उपयोग करने वाले रास्टर चित्र के लिए यह चरण लें; फ़्रेम निर्माण, पुल और गहराई क्रम अलग डिज़ाइन काम हैं।

स्पष्ट सिलुएट या सरल सपाट चित्र से शुरू करें। पैनल में रखने से पहले वापस मिली रूपरेखा में अलग टुकड़े और छूटे छेद देखें। [लाइन आर्ट से SVG गाइड](https://perfectvector.com/hi/blog/line-art-to-svg) रूपरेखा ट्रेस और मूल खींची रेखा का अंतर बताती है।

विस्तृत फ़ोटो में तय करना होगा कि कौन-सा ऑब्जेक्ट किस गहराई पर और कौन-सी आकृति कागज़ बने। पैनल की योजना से पहले उन्हें सरल या फिर बनाएँ। स्वचालित रंग अलगाव संयोजन योजना नहीं देता।

## गंतव्य फ़ाइल जाँचें, फिर सामग्री पर परीक्षण करें

SVG डिज़ाइन जाँच तब पूरी है जब बाहरी सीमा मिले, इच्छित बचने वाले क्षेत्र जुड़ें, ओवरलैप की जोड़-रेखाएँ हटें और सहेजा स्टैक सही विवरण दिखाए। मास्टर के साथ क्रमांकित लेयर सूची रखें ताकि संयोजन क्रम स्पष्ट हो।

अंतिम प्रोजेक्ट बनाने से पहले वास्तविक कटिंग ऐप और फ़्रेम में जाँचें:

* आयातित पैनल के आयाम इच्छित आकार से मिलते हैं।
* प्रीव्यू में छेद बचे हैं और अनचाहे अंदरूनी कट नहीं।
* हर पैनल को इच्छित कटिंग ऑपरेशन और सामग्री मिली है।
* सबसे लंबे पुल का छोटा नमूना कटिंग, मैट से निकालने और संभालने में बचता है।
* चुने स्पेसर बची सामग्री पर फिट होते हैं और छेद से नहीं दिखते।
* जुड़ा स्टैक बैकिंग लगी अवस्था में फ़्रेम में फिट होता है।

आयात छेद या सीमा बदले तो सहेजी ज्यामिति पर लौटकर वही कंटूर सुधारें। पुल फटे या मुड़े तो चौड़ाई, लंबाई, जोड़ या सामग्री बदलें और फिर जाँचें। केवल ब्राउज़र रेंडर भौतिक सवाल हल नहीं करता। [सामान्य Cricut SVG तैयारी गाइड](https://perfectvector.com/hi/blog/svg-files-for-cricut) व्यापक फ़ाइल जाँच बताती है।

## अक्सर पूछे जाने वाले सवाल

### क्या तस्वीर अपने आप शैडो-बॉक्स SVG बन सकती है?

वेक्टराइज़ेशन तस्वीर से आकृतियाँ वापस पा सकता है, लेकिन गहराई लेयर, फ़्रेम के जोड़, कटआउट और संयोजन क्रम चुनना बाकी है। सरल सिलुएट उपयोगी शुरुआत है। जटिल फ़ोटो को हाथ से सरल या फिर बनाना पड़ सकता है।

### क्या हर शैडो-बॉक्स पैनल एक SVG पाथ होना चाहिए?

एक पाथ में असंबद्ध पॉज़िटिव द्वीप हो सकते हैं। पाथ संख्या के बजाय बचे क्षेत्र और वास्तविक कंटूर जाँचें। हमारे उदाहरण में जुड़ा पिछला पैनल और अलग चाँद वाला विपरीत उदाहरण दोनों एक पाथ एलिमेंट रखते हैं।

### पुल कितने चौड़े होने चाहिए?

सामग्री, फैलाव, अंतिम आकार और कटिंग कार्यप्रवाह के लिए चुनें और जाँचें। दिखाया चाँद का पुल 4 mm चौड़ा है, लेकिन हमने काटा या मज़बूती नहीं जाँची। यह उदाहरण आयाम है, सार्वभौमिक न्यूनतम नहीं।

### क्या शैडो-बॉक्स लेयर Cricut रंग लेयर जैसी है?

शैडो-बॉक्स लेयर गहराई विन्यास का पैनल है। रंग लेयर आर्टवर्क को रंग या सामग्री से अलग करती है। गहराई पैनल में एक फ़्रेम से जुड़े कई चित्र हो सकते हैं; केवल रंग से अलग करने पर उनके जोड़ डिज़ाइन नहीं होते।

## स्रोत

1. [Inkscape — बूलियन ऑपरेशन](https://inkscape-manuals.readthedocs.io/en/latest/boolean-operations.html) — Union, Difference, Combine और स्टैक क्रम का दस्तावेज़।
2. [W3C — SVG निर्देशांक तंत्र, ट्रांसफ़ॉर्म और इकाइयाँ](https://www.w3.org/TR/SVG2/coords.html#ViewBoxAttribute) — `viewBox` से मैप निर्देशांक आयत तय करता है।
3. [W3C — SVG रंगाई](https://www.w3.org/TR/SVG2/painting.html#FillRuleProperty) — उदाहरण के फ़िल, सबपाथ और `evenodd` नियम तय करता है।
4. [PerfectVector — SVG for Cricut](https://perfectvector.com/svg-for-cricut) — रास्टर आर्टवर्क वापस पाना, आकृति समीक्षा और काटने से पहले जाँच बताता है।

***

चित्र PNG या JPG से शुरू हो तो [PerfectVector से SVG पाथ तैयार करें](https://perfectvector.com/hi/svg-for-cricut), फिर रूपरेखा और छेद देखें। एडिटर में फ़्रेम जोड़ और गहराई लेयर बनाएँ, सहेजे पैनल फिर खोलें और अंतिम शैडो बॉक्स से पहले सामग्री का छोटा नमूना जाँचें।

## Explore

- [Read the HTML article](https://perfectvector.com/hi/blog/shadow-box-svg-connected-layers)
- [Cricut नॉकआउट: आधार और नाम की लेयर की योजना](https://perfectvector.com/hi/blog/cricut-knockout-real-cutouts.md)
- [आपके Cricut SVG की वीडिंग इतनी मुश्किल क्यों है (और फ़ाइल में आप कौन-सा हिस्सा ठीक कर सकते हैं)](https://perfectvector.com/hi/blog/cricut-svg-hard-to-weed.md)
- [Product facts](https://perfectvector.com/product-facts.md)
- [FAQ](https://perfectvector.com/faq.md)
- [Pricing and credits](https://perfectvector.com/pricing.md)