diff --git a/js/fox.js b/js/fox.js
index b6a3b01..0f322ad 100644
--- a/js/fox.js
+++ b/js/fox.js
@@ -75,7 +75,12 @@ var Fox = function (IMG_WIDTH, IMG_HEIGHT) {
   return {
     canvas: {
       height: IMG_HEIGHT,
-      width: IMG_WIDTH
+      width: IMG_WIDTH,
+      color: hsl(
+        chance.integer({min:120, max:320}),
+        chance.integer({min:50, max:60}),
+        chance.integer({min:30, max:50})
+      )
     },
     head: {
         origin: origin,
diff --git a/server.js b/server.js
index 1ebb6cf..5ec2fc1 100644
--- a/server.js
+++ b/server.js
@@ -57,18 +57,10 @@ function renderHead(ctx, opts) {
     ctx.save();
     ctx.translate(ctx.canvas.width/2, ctx.canvas.height/2);
     ctx.rotate(Math.PI / 4);
-    var tempCanvas = new Canvas(ctx.canvas.width, ctx.canvas.height);
-    var tempCtx = tempCanvas.getContext('2d');
-    tempCtx.save();
-    tempCtx.translate(ctx.canvas.width/2, ctx.canvas.height/2);
-    tempCtx.rotate(Math.PI / 4);
-    tempCtx.fillStyle = opts.color;
-    tempCtx.fillRect(0, 0, ctx.canvas.width, ctx.canvas.height);
-    tempCtx.fill();
-    drawEllipseByCenter(tempCtx, ctx.canvas.width / 2, ctx.canvas.height, 0.1 * ctx.canvas.width, 0 * ctx.canvas.height, '#fff', null, 0.5);
-    var pattern = ctx.createPattern(tempCanvas);
-    drawEllipseByCenter(ctx, 0, 0, opts.width, opts.height, opts.color, pattern, opts.kappa);
+    drawEllipseByCenter(ctx, 0, 0, opts.width, opts.height, opts.color, null, opts.kappa);
     ctx.restore();
+    ctx.clip();
+    drawEllipseByCenter(ctx, ctx.canvas.width / 2, ctx.canvas.height, ctx.canvas.width, 0.9 * ctx.canvas.height, '#fff', '#fff', 0.5);
 }
 
 function renderEars(ctx, opts) {