canvas

gistfile1.js

var canvas = document.getElementById('kettle'),
ctx = canvas[0].getContext('2d');
ctx.save();

ctx.beginPath();
ctx.moveTo(0.0, 0.0);
ctx.lineTo(155.6, 0.0);
ctx.bezierCurveTo(155.6, 0.0, 155.3, 62.1, 155.3, 80.7);
ctx.lineTo(155.3, 244.2);
ctx.bezierCurveTo(155.3, 294.2, 198.5, 319.9, 276.3, 319.9);
ctx.bezierCurveTo(336.4, 319.9, 378.0, 292.7, 378.0, 222.7);
ctx.lineTo(378.0, 92.1);
ctx.bezierCurveTo(378.0, 63.6, 378.5, 0.0, 378.5, 0.0);
ctx.lineTo(529.0, 0.0);
ctx.lineTo(529.0, 52.9);
ctx.lineTo(489.6, 52.9);
ctx.bezierCurveTo(459.6, 52.9, 452.4, 62.1, 452.4, 92.1);
ctx.lineTo(452.4, 228.4);
ctx.bezierCurveTo(452.4, 354.1, 358.6, 387.0, 266.3, 387.0);
ctx.bezierCurveTo(173.2, 387.0, 78.0, 354.1, 78.0, 244.2);
ctx.lineTo(78.0, 82.1);
ctx.bezierCurveTo(78.0, 60.0, 61.6, 52.9, 30.1, 52.9);
ctx.lineTo(0.0, 52.9);
ctx.lineTo(0.0, 0.0);
ctx.closePath();
ctx.fillStyle = "rgb(87, 80, 76)";
ctx.fill();
ctx.restore();