JSFiddle - React, Tailwind, and code Playground

HTML

<canvas id="canvas1"></canvas>
<canvas id="canvas2"></canvas>

CSS

canvas {
  border: 1px dashed;
}


body {
  display: flex;
  margin: 0;
  overflow: hidden;
  align-items: center;
  justify-content: space-around;
}

html, body {
  height: 100%;
}

JavaScript

var ctx1 = canvas1.getContext('2d');
var ctx2 = canvas2.getContext('2d');

canvas1.width = canvas2.width = 200;

ctx1.rect(50, 10, 100, 100);
ctx1.stroke();

ctx2.rect(50.5, 10.5, 100, 100);
ctx2.stroke();