I’ll give two fast demonstrations of katex 12. For a quick reference on LaTeX try Overleaf.

Previously I have been using MathJax, as in this post.

As NPM

After installing with npm install katex, which would put katex under node_modules.

<!DOCTYPE html>
<meta charset="UTF-8">

<link rel="stylesheet" type="text/css" 
href="/node_modules/katex/dist/katex.min.css">
<script type="text/javascript" 
src="/node_modules/katex/dist/katex.min.js"></script>

<div id="mykatex2">...</div>
<script type="text/javascript">
	katex.render("c = \\pm\\sqrt{a^2 + b^2}", mykatex2, {
    throwOnError: false
});
</script>

From CDN

This method doesn’t require installing anything.

<!DOCTYPE html>
<meta charset="UTF-8">

<script type="module" type="text/javascript">
    import katex from 'https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/katex.mjs';
    katex.render("e^{i\\pi}+1=0", mykatex2, {"displayMode":true,"leqno":false,"fleqn":false,"throwOnError":true,"errorColor":"#cc0000","strict":"warn","trust":false,"macros":{"\\f":"f(#1)"}});
</script>
<script nomodule defer src="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/katex.js" integrity="sha384-4z8mjH4yIpuK9dIQGR1JwbrfYsStrNK6MP+2Enhue4eyo0XlBDXOIPc8b6ZU0ajz" crossorigin="anonymous"></script>

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/katex.css" integrity="sha384-bsHo4/LA+lkZv61JspMDQB9QP1TtO4IgOf2yYS+J6VdAYLVyx1c3XKcsHh0Vy8Ws" crossorigin="anonymous"><link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/katex.css" integrity="sha384-bsHo4/LA+lkZv61JspMDQB9QP1TtO4IgOf2yYS+J6VdAYLVyx1c3XKcsHh0Vy8Ws" crossorigin="anonymous">

<script defer src="https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/katex.js" integrity="sha384-4z8mjH4yIpuK9dIQGR1JwbrfYsStrNK6MP+2Enhue4eyo0XlBDXOIPc8b6ZU0ajz" crossorigin="anonymous"></script>

<div id="mykatex2">...</div>