Reduce font size of Prismjs

January - 2022

To reduce the font size of prismjs in a next.js app, wrap the <pre><code>..</code></pre> block in a div and set a base text size there.

For example:

<div className="text-sm">
    <pre className="line-numbers">
        <code className="language-jsx">{code}</code>
    </pre>
</div>

That's using text-sm from tailwind.

The prismjs files set a font size of 1em. So the outside div sets the base that gets uses.