Generate an image from text using the Canvas API

generate-text-image.js

function generateImageFromText(text, width, height) {
    // TODO Add auto-wrapping logic when text is too wide
    // TODO Add tiered text scaling (if height > 200: font-size = 36; else if height > 100: font-size = 18; etc)
    const canvas = document.createElement('canvas');
    canvas.width = width;
    canvas.height = height;

    const ctx = canvas.getContext('2d');
    const fontSize = Math.min(height, 36);
    ctx.fillStyle = '#212121';
    ctx.font = `${fontSize}px 'Helvetica Neue', Helvetica, Arial, sans-serif`;
    ctx.textBaseline = 'middle';
    ctx.textAlign = 'center';
    ctx.fillText(text, width / 2, height / 2, width);
    return canvas.toDataURL('image/gif');
}