SVG

Scalable Vector Graphics are an XML based 2D vector graphics format.

SVGs are commonly used as buttons in a skin. Both built-in skins (Silhouette and Simplex) use SVGs for their buttons.

Common Issue

One of the most common problems is the wrong mime type for the SVG graphics. In this case the image is not displayed correctly on some browsers like on the iPhone/iPad. You need to make sure that your web server is serving the file with the type image/svg+xml. If you are using Apache as your web server you can add the following line to your .htaccess file to make sure that the correct mime type is used.

AddType image/svg+xml .svg

If you are using Microsofts IIS you need to add the following to your web.config file:

<configuration>
    <system.webServer>
        <staticContent>
            <mimeMap fileExtension=".svg" mimeType="image/svg+xml" />
     </staticContent>
    </system.webServer>
</configuration>

To test the mime type you can use this website or the command line tool curl with following line:

curl -I http://example.com/your.svg http://example.com/your.svg


See also