JSFiddle - React, Tailwind, and code Playground

HTML

<canvas id="canvas1" width="500" height="500"></canvas>

JavaScript

var can = document.getElementById('canvas1');
var ctx = can.getContext('2d');

    ctx.fillStyle = 'red';
    ctx.save(); // save the fact that the fillstyle is red
    ctx.fillStyle = 'blue'; // change the fillstyle
    ctx.fillRect(0,0,5,5); // draws a blue rectangle
    ctx.restore(); // restores the old context state, so the fillStyle is back to red
    ctx.fillRect(10,0,5,5); // draws a red rectangle // draws a red rectangle