HTML5 has support for inline SVG. Here we draw a polygon shape using SVG tags.
SVG-Polygon code
<svg width="400" height="200">
<polygon points="40,80 50,40 50,40 150,60 150,60 220,50 220,50 220,10 220,10 240,40 240,40 260,90 260,90 220,150 220,150 140,150 140,150 80,70 "
style="fill:LightBlue;stroke:black;stroke-width:3;"></polygon>
</svg>
Note: for drawing polygon we use some properties there are:
Fill: fill the color
Stroke: set stroke color
Stroke-width: set the stroke width
Screen Shot
Another polygon example
Here we draw a regular polygon shape
<svg width="200" height="200">
<polygon points="0,100 0,50 0,50 50,0 50,0 100,0 100,0 150,50 150,50 150,100 150,100 100,150 100,150 50,150 50,150 0,100"
style="fill:LightGreen;stroke:black;stroke-width:1;"></polygon>
</svg>
Screen Shot
Leave Comment