How to create image using SVG

Posted on by Rashmi Mantri

Let me give you small intro and example about SVG. Previously we use to have images in the format of PNG, GIF and JPEG. Nowadays, most of the designers are using SVG format images for websites because it is scalable which means image quality remain same on any device.Moreover they are good for rentina screen. This is tag is added in HTML5.

Example

Let’s create rectangle using SVG.

->Open your favorite text editor( notepad or notepad++..)

->Write the below code

<svg><rect width=”300px” height=”200″ style=”fill: #000;”/></svg>

result:

create image using SVG

You can place, above code anywhere in your html page. It’s so simple.