How can I use custom fonts in an HTML5 Canvas element?

I’ve thrown together a simple demo on jsfiddle here showing how to do this with @font-face: http://jsfiddle.net/zMKge/ Opera also has a simple tutorial on using <canvas>, including the text API. CSS: @font-face { font-family: ‘KulminoituvaRegular’; src: url(‘http://www.miketaylr.com/f/kulminoituva.ttf’); } Javascript: var ctx = document.getElementById(‘c’).getContext(‘2d’); var kitty = new Image(); kitty.src=”http://i954.photobucket.com/albums/ae30/rte148/891blog_keyboard_cat.gif”; kitty.onload = function(){ ctx.drawImage(this, 0,0,this.width, this.height); … Read more