Usando un lienzo JS con una fuente alineada con píxeles, el texto se representa usando un Math.floor ([ancho] / 2) pero termina borroso. El resultado es inconsistente con diferentes dispositivos. Ambos dispositivos usan resolución nativa pero parecen diferentes.

 ctx.font = "16px 'Press Start 2P'"; ctx.fillStyle = 'black'; ctx.fillRect(0, 0, 400, 300); ctx.fillStyle = 'white'; ctx.fillText('Blurry', Math.floor(400 / 2), 100); ctx.fillText('Clear', 200.5, 200);

Ejemplo: https://jsfiddle.net/tsqdvfk9/

Estas dos imágenes muestran el violín anterior, pero en los dos dispositivos diferentes a los que se hace referencia anteriormente:

1er dispositivo

segundo dispositivo

El dispositivo 1 es un Windows 10 que usa 2 monitores Acer H226HQL

El dispositivo 2 es un Chromebook Acer N18Q8