title: Unable to use a Google font on Canvas
body: <p>This is my code:</p>
  
  <pre><code>img.onload = function() {
  
    ctx.drawImage(img, 0, 0, 600, 480);
  
    ctx.lineWidth  = 4;
    ctx.font = "3em 'Lato'";
    ctx.strokeStyle = 'black';
    ctx.fillStyle = 'white';
  
    var text = 'Custom Text';
    text = text.toUpperCase();
    x = canvas.width/2;
    y = canvas.height - canvas.height/4.5;
    ctx.strokeText(text, x, y);
    ctx.fillText(text, x, y);
  }
  </code></pre>
  
  <p>The font on the canvas is not Lato. After reading other answers, I thought it may be because I am not using it on any other HTML element but then I also added a heading that uses the <code>Lato</code> font. Is there anything else that can cause this issue?</p>