<html>
<body>
  <canvas width="500" height="500"></canvas>
<script>
  var canvas = document.getElementsByTagName('canvas')[0];
  var ctx = canvas.getContext('2d');

  ctx.fillStyle = "red";
  ctx.beginPath();
  ctx.rect(250, 250, 50, 50);
  ctx.clip();
  ctx.fillRect(0,0,500,500);
</script>
</body>
</html>