1. Techno

HTML SVG | Scalable Vector graphics example


SVG stands for Scalable Vector Graphics. It used to draw the SVG graphics. With the help of SVG, we can draw the different types of graphics on the page.

We can draw boxes, circles, rectangle, text, and graphic images.

SVG Rectangle-

HTML SVG


<!DOCTYPE html>
<html>
<head>
<title>HTML SVG </title>
</head>
<body>

  

</body>
</html>
Run

In above example we have used tag .

1. Specified the height 200 and width 500 of SVG tag .

2. used to draw rectangle on svg graphic .

3. Specified the height 200 and width 500 of the rectangle .

4. Fill the color and given stroke (border) color and value .



SVG Circle-

We can draw the circle using SVG.

The following example of the circle using SVG.

HTML SVG


<!DOCTYPE html>
<html>
<head>
<title>HTML SVG </title>
</head>
<body>

  


</body>
</html>
Run

SVG STAR ( Polygon)

Draw the star on the web page. We can create the star using polygon coordinates x and y. The following example of the star will show you how to exactly draw the star.


HTML SVG


<!DOCTYPE html>
<html>
<head>
<title>HTML SVG </title>
</head>
<body>


  


</body>
</html>
Run

Please Share

Recommended Posts:-