HTML5 Canvas Text Font, Size, and Style Tutorial

To draw text using HTML5 Canvas, we can use the font property and the fillText() method of the canvas context.

To set the font, size, and style of HTML5 Canvas text, we can set the font property of the canvas context to a string containing the font style, size, and family, delimited by spaces.  The style can be normal, italic, or bold.  unless otherwise specified, the font style is defaulted to normal.

Once the font property has been set, we can draw the text with the fillText() method, which requires a string and an x and y position.

new window

Code Editor

Modified on April 8th, 2013 by Eric Rowell
comments powered by Disqus