Code used in this page

<!-- 
	Inline SVG - only works sent as application/xhtml+xml or text/xml, or in later 
	web browsers (Firefox 4, Google Chrome 7, Internet Explorer 9 etc) 
-->
<svg width="200" height="110" version="1.1" xmlns="http://www.w3.org/2000/svg">
	<circle cx="100" cy="52" r="50" stroke="#0000ff" stroke-width="1" fill="#ff0000" />
</svg>


<!-- Included from separate file -->
<embed src="circle.svg" width="200" height="110" type="image/svg+xml"></embed>
<iframe src="circle.svg" width="200" height="110" type="image/svg+xml"></iframe>
<object data="circle.svg" width="200" height="110" type="image/svg+xml"></object>
				
<div id="svg-demo"></div>

<script>
	// Via regular JavaScript
	var svg = document.createElementNS("http://www.w3.org/2000/svg", "svg"),
		circle = document.createElementNS("http://www.w3.org/2000/svg", "circle");
	svg.setAttribute("width", "200");
	svg.setAttribute("height", "110");
	svg.setAttribute("version", "1.1");

	circle.setAttribute("cx", "100");
	circle.setAttribute("cy", "52");
	circle.setAttribute("r", "50");
	circle.setAttribute("fill", "#ff0000");
	circle.setAttribute("stroke", "#00ffff");
	svg.appendChild(circle);
	document.getElementById("svg-demo").appendChild(svg);
</script>


<div id="raphael-demo"></div>
<script src="raphael.js"></script>
<script>
	window.onload = function () {
		// SVG & VML via Raphaël JavaScript library
		var paper = Raphael(document.getElementById("raphael-demo"), 320, 200),
			circle = paper.circle(150, 62, 60);
		circle.attr("fill", "#ff0000");
		circle.attr("stroke", "#00ffff");
	};			
</script>