ctx.beginPath(); ctx.fillStyle = 'yellow'; ctx.moveTo(125,75); ctx.arc(75,75,50,0,Math.PI*2,true); // Outer circle ctx.stroke(); ctx.fill(); ctx.moveTo(110,75); ctx.arc(75,75,35,0,Math.PI,false); // Mouth ctx.stroke(); ctx.beginPath(); ctx.fillStyle = 'black'; ctx.moveTo(65,65); ctx.arc(60,65,5,0,Math.PI*2,true); // Left eye ctx.fill(); ctx.moveTo(95,65); ctx.arc(90,65,5,0,Math.PI*2,true); // Right eye ctx.fill(); (shortcut: Alt+R)

This page lets you play with the HTML5 <canvas> element supported in Gecko 1.8 and later. See the list of canvas-related resources on MDC.
by Nickolay Ponomarev and Richard Heyes.