<!DOCTYPE html>

<html>
<head>
<title>HTML 5 Canvas</title>

<script type="text/javascript">
    function draw() {  
     var canvas = document.getElementById("canvas");  
     var ctx = canvas.getContext("2d");  

     ctx.fillStyle = "rgb(200,0,0)";  
     ctx.fillRect (10, 10, 55, 50);  

     ctx.fillStyle = "rgba(0, 0, 200, 0.5)";  
     ctx.fillRect (30, 30, 55, 50);  
    }
</script>

</head>

<body onload="draw()">

<canvas id='canvas'
        width="300" height="300">
    Fallback text when canvas is not available.
</canvas>

</body>
</html>
