SVG stands for Scalable Vector Graphics. SVG is used to describe graphics in XML. It is a W3C recommendation. It is useful while drawing vector like diagrams such as 2D graphs, pie charts, etc. < svg> element is the root of a SVG framework.
HTML In XML, SVG is a modularized language for describing visuals. It is an XML document that describes two-dimensional vector and combined vector/raster graphics. It's a suggestion from the World Wide Web Consortium (W3C). XML text files define SVG pictures and associated actions. As with XML files, an SVG image can be created and edited with a text editor; however, drawing applications like ink space are typically used to do it.
The following are some of the benefits of utilizing SVG over other image formats (such as JPEG and GIF):
Any text editor can be used to create and edit SVG images.
Searching, indexing, scripting, and compressing SVG graphics are all possible.
SVG images can be scaled.
SVG pictures can be reproduced in high resolution at any size.
Drawing a SVG circle
Drawing a SVG rectangle
Drawing a SVG polygon
Example No.1:
<html>
<body>
<h1>Knowledge2life</h1>
<svg width="100" height="100">
<circle cx="50" cy="50" r="40"
stroke="green" stroke-width="4" fill="yellow" />
Sorry, your browser does not support inline SVG.
</svg>
</body>
</html>
OUTPUT:
Knowledge2life
Example No.2:
<html>
<body>
<h1>Knowledge2life</h1>
<svg width="400" height="100">
<rect width="400" height="100"
style="fill:rgb(0,0,255);stroke-width:10;stroke:rgb(0,0,0)" />
Sorry, your browser does not support inline SVG.
</svg>
</body>
</html>
