Scalable Vector Graphics

Scalable Vector Graphics (SVG) are a type of two dimensional picture that work on vectors, rather than pixels. This means they can become bigger or smaller without losing any quality or becoming blurry. SVG is based on XML and created by the World Wide Web Consortium (W3C).

History

The W3C published SVG in September 2001. As of 2018 SVG is widely supported in all modern browsers.

The normal Filename extension is .svg and the MIME-Type is image/svg+xml.

Structure

SVG uses Extensible Markup Language (XML). So it has a definition of the document type.

<syntaxhighlight lang="xml">

<?xml version="1.0" encoding="utf-8"?>

<svg xmlns="http://www.w3.org/2000/svg"
 xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:ev="http://www.w3.org/2001/xml-events"
 version="1.1" baseProfile="full"
 width="800mm" height="600mm">


</svg>

</syntaxhighlight>

Difference between bitmap and vector images

This image shows the difference between bitmap and vector images. The vector image can be scaled forever, while the bitmap can not.

Scalable Vector Graphics Media

• 

  SVG example markup displayed on a grid.*The image demonstrates the below example markup: <rect x="25" y="25" width="200" height="200" fill=

Other websites

• VectorMagic Online raster to SVG converter