font property

The font property sets the font settings when it is drawn on the canvas using the fillText or strokeText methods. The method accepts the same parameters as the CSS font property.

Syntax

context.font = font settings;

Example

Let's draw some text on the canvas with fillText and give it a size of 30px and an Arial type with font:

<canvas id="canvas" width="200" height="200" style="background: #f4f4f4;"></canvas>

let canvas = document.querySelector('#canvas');
let ctx = canvas.getContext('2d');

ctx.font = '30px Arial';
ctx.fillText('Hello world', 30, 50);

font property

Syntax

Example

See also