Propriété fillStyle

La propriété fillStyle définit la couleur de remplissage d'une forme lors du dessin sur canvas. La valeur de la propriété peut être n'importe quelle unité CSS pour la couleur.

Syntaxe

javascriptcontexte.fillStyle = couleur;

Exemple

Dessinons un carré à l'aide de rect et remplissons-le avec la couleur rouge :

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

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

ctx.rect(50, 50, 100, 100);
ctx.fillStyle = 'red';
ctx.fill();

Результат:

Voir aussi