Previous Next

SVG Introduction

SVG stands for scalable vector graphics it is used to define vector based graphics for the web in XML formate. SVG grapgics do not lose its quality when they are zoomed or resized.

Syntax

<svg width="width" height="height">
Drawings here...
</svg>

You can define one or more than one SVG elements in a document and they are rendered on top of the previous elements.

Embedding Files

SVG files can be displayed directly in the browser or embedded in HTML files through different methods such as iframe, image etc.

Syntax

<iframe src="svg url"></iframe>

You can define one or more than one iframes in a document.

Practice Task

Open notepad or any other text editor, follow the following points.

• Use <svg> element to draw svg circle on webpage
• Give width and height of 200 200 respectivelly
• color should be orange

save file with name task.html or task.htm and then open it using any browser and see results.

SVG Code Generators

Try our SVG generators to practice and generate SVG code in real time.

Previous Next