---
title: 'SVG: स्केलेबल वेक्टर ग्राफिक्स'
slug: Web/SVG
translation_of: Web/SVG
---
<p>{{SVGRef}}</p>

<div class="callout-box"><strong><a href="/en-US/docs/SVG/Tutorial">शुरू करना</a> </strong>यह ट्यूटोरियल आपको एसवीजी का उपयोग शुरू करने में मदद करेगा।</div>

<p class="summary" style="border-top-width: 0; padding-top: 0;"><span class="seoSummary"><strong>स्केलेबल वेक्टर ग्राफिक्स (</strong></span><strong>एसवीजी)</strong> दो आयामी आधारित <a href="https://en.wikipedia.org/wiki/Vector_graphics">वेक्टर ग्राफिक्स</a> का वर्णन करने के लिए एक <a href="/en-US/docs/XML">XML</a>- आधारित मार्कअप भाषा है। एसवीजी अनिवार्य रूप से ग्राफिक्स के लिए है जैसे <a href="/en-US/docs/HTML">HTML</a> पाठ के लिए है।</p>

<p>एसवीजी एक पाठ-आधारित खुला वेब मानक है। इसे स्पष्ट रूप से अन्य वेब मानकों जैसे कि <a href="/en-US/docs/CSS">CSS</a>, <a href="/en-US/docs/DOM">DOM</a>, और <a href="/en-US/docs/SMIL">SMIL</a> के साथ काम करने के लिए डिज़ाइन किया गया है।</p>

<p>एसवीजी छवियां और उनके संबंधित व्यवहार एक्सएमएल पाठ फ़ाइलों में परिभाषित किए गए हैं, जिसका अर्थ है कि उन्हें खोजा, अनुक्रमित, स्क्रिप्ट किया और संकुचित किया जा सकता है। इसके अतिरिक्त इसका मतलब है कि उन्हें किसी भी टेक्स्ट एडिटर के साथ और ड्राइंग सॉफ्टवेयर के साथ बनाया और संपादित किया जा सकता है।</p>

<p>एसवीजी 1999 से <a href="https://www.w3.org/">वर्ल्ड वाइड वेब कंसोर्टियम (W3C)</a> द्वारा विकसित एक खुला मानक है।</p>

<p> </p>

<div class="cleared row topicpage-table">
<div class="section">
<h2 class="Documentation" id="प्रलेखन">प्रलेखन</h2>

<dl>
 <dt><a href="/en-US/docs/Web/SVG/Element">एसवीजी तत्व संदर्भ</a></dt>
 <dd>प्रत्येक एसवीजी तत्व के बारे में विवरण।</dd>
 <dt><a href="/en-US/docs/Web/SVG/Attribute">एसवीजी विशेषता संदर्भ</a></dt>
 <dd>प्रत्येक एसवीजी विशेषता के बारे में विवरण।</dd>
 <dt><a href="/en-US/docs/DOM/DOM_Reference#SVG_interfaces">एसवीजी डोम इंटरफ़ेस संदर्भ</a></dt>
 <dd>जावास्क्रिप्ट के साथ बातचीत के लिए एसवीजी डोम एपीआई के बारे में विवरण।</dd>
 <dt><a href="/en-US/docs/Web/SVG/Applying_SVG_effects_to_HTML_content">HTML सामग्री में एसवीजी प्रभाव लागू करना</a></dt>
 <dd>एसवीजी साथ मिलकर काम करता है {{Glossary("HTML")}}, {{Glossary("CSS")}} तथा {{Glossary("JavaScript")}}. करने के लिए SVG का उपयोग करें <a href="/en-US/docs/SVG_In_HTML_Introduction">एक नियमित HTML पेज या वेब एप्लिकेशन बढ़ाएँ।</a></dd>
</dl>

<p><span class="alllinks"><a href="/en-US/docs/tag/SVG">सभी देखें...</a></span></p>

<h2 class="Community" id="समुदाय">समुदाय</h2>

<ul>
 <li>मोज़िला फ़ोरम देखें... {{DiscussionList("dev-tech-svg", "mozilla.dev.tech.svg")}}</li>
</ul>

<h2 class="Tools" id="उपकरण">उपकरण</h2>

<ul>
 <li><a href="https://github.com/w3c/svgwg/wiki/Testing">एसवीजी टेस्ट सूट</a></li>
 <li><a href="https://validator.w3.org/#validate_by_input">मार्कअप वैलिडेटर</a></li>
 <li><a href="/en-US/docs/tag/SVG:Tools">अधिक उपकरण ...</a></li>
 <li>अन्य संसाधन: <a href="/en-US/docs/XML">XML</a>, <a href="/en-US/docs/CSS">CSS</a>, <a href="/en-US/docs/DOM">DOM</a>, <a href="/en-US/docs/HTML/Canvas">Canvas</a></li>
</ul>
</div>

<div class="section">
<h2 class="Related_Topics" id="उदाहरण">उदाहरण</h2>

<ul>
 <li>Google मानचित्र (मार्ग ओवरले) और डॉक्स (स्प्रेडशीट चार्टिंग)</li>
 <li><a href="http://starkravingfinkle.org/projects/demo/svg-bubblemenu-in-html.xml">SVG bubble menus</a></li>
 <li><a href="http://jwatt.org/svg/authoring/">SVG authoring guidelines</a></li>
 <li><a href="/en-US/docs/Mozilla_SVG_Project">Mozilla SVG Project</a></li>
 <li><a href="/en-US/docs/SVG/FAQ">Frequently asked questions</a> regarding SVG and Mozilla</li>
 <li><a href="/en-US/docs/SVG/SVG_as_an_Image">SVG as an image</a></li>
 <li><a href="/en-US/docs/SVG/SVG_animation_with_SMIL">SVG animation with SMIL</a></li>
 <li><a href="http://plurib.us/1shot/2007/svg_gallery/">SVG art gallery</a></li>
</ul>

<h3 id="एनीमेशन_और_बातचीत">एनीमेशन और बातचीत</h3>

<p>HTML की तरह, SVG में एक डॉक्यूमेंट मॉडल (DOM) और इवेंट्स हैं, और यह जावास्क्रिप्ट से एक्सेस किया जा सकता है। यह डेवलपर्स को समृद्ध एनिमेशन और इंटरैक्टिव छवियां बनाने की अनुमति देता है।</p>

<ul>
 <li>कुछ सुंदर एस.वी.जी. <a href="http://svg-wow.org/">svg-wow.org</a></li>
 <li>फ़ायरफ़ॉक्स विस्तार (<a href="http://schepers.cc/grafox/">Grafox</a>) का सबसेट जोड़ने के लिए {{Glossary("SMIL")}} एनीमेशन का समर्थन</li>
 <li>इंटरएक्टिव <a href="http://demo.huihoo.com/amplesdk/examples/applications/svgalbum/index.html">तस्वीरें</a> हेरफेर</li>
 <li><a href="http://starkravingfinkle.org/blog/2007/07/firefox-3-svg-foreignobject/">HTML transformations</a> using SVG's <code>foreignObject</code></li>
</ul>

<h3 id="मानचित्रण_चार्टिंग_गेम_और_3-डी_प्रयोग">मानचित्रण, चार्टिंग, गेम और 3-डी प्रयोग</h3>

<p>जबकि थोड़ा एसवीजी वेब सामग्री को बढ़ाने के लिए एक लंबा रास्ता तय कर सकता है, यहां भारी एसवीजी उपयोग के कुछ उदाहरण हैं।</p>

<ul>
 <li><a href="https://web.archive.org/web/20131019072450/http://www.treebuilder.de/svg/connect4.svg" title="Archive link provided because source now requires authentication.">Connect 4</a></li>
 <li><a href="http://jvectormap.com/">jVectorMap</a> (डेटा विज़ुअलाइज़ेशन के लिए इंटरेक्टिव मानचित्र)</li>
 <li><a href="http://jointjs.com">JointJS</a> (जावास्क्रिप्ट आरेख पुस्तकालय)</li>
</ul>
</div>
</div>