JSFiddle - React, Tailwind, and code Playground

JavaScript

var c = document.createElement("canvas");
document.body.appendChild(c);

var ctx = c.getContext("2d");

ctx.font = "20px Arial";
console.log("px width:", ctx.measureText("M").width);

ctx.font = "20pt Arial";
console.log("pt width:", ctx.measureText("M").width);

ctx.font = "20em Arial";
console.log("em width:", ctx.measureText("M").width);

ctx.font = "20% Arial";
console.log("% width:", ctx.measureText("M").width);