HTML5 Canvas Tag

<!DOCTYPE html>
<html>
	<head>
    	<title>Canvas Tag</title>
    </head>
    <body>
    	
	  
       <canvas id="canvasuses" width="250" height="125">
			<p>Your browser does not support the HTML5 canvas element.</p>
		</canvas>
		 
		<script type="text/javascript">
		 
		var c=document.getElementById("canvasuses");
		var canvOK=1;
		try {c.getContext("2d");}
		catch (er) {canvOK=0;}
		if (canvOK==1)
			{
			var ctx=c.getContext("2d");
			var grd=ctx.createLinearGradient(0,0,200,0);
			grd.addColorStop(0,"green");
			grd.addColorStop(1,"white");
			ctx.fillStyle=grd;
			ctx.fillRect(10,10,150,80);
				}
		 
		</script>
		
		<hr />
		
		<canvas id="myCanvas" width="250" height="100"></canvas>
		<script>
		var c = document.getElementById("myCanvas");
		var ctx = c.getContext("2d");
		// Create gradient
		var grd = ctx.createRadialGradient(75,50,5,90,60,100);
		grd.addColorStop(0,"red");
		grd.addColorStop(1,"white");
		
		// Fill with gradient
		ctx.fillStyle = grd;
		ctx.fillRect(10,10,150,80);
		</script>
        
		
    </body>
</html>

Output :

Topic :Canvas Tag