Universal Inline & Display LaTeX Renderer (KaTeX)

ParaMigi
2025-07-12T20:40:03Z

Render inline and display LaTeX math on any website using KaTeX. Careful with input fields! Be sure to have rendering OFF when entering an input field, otherwise you can mess up your delimiters. I have made a fix button for this, but it might not be exactly correct.

.

.

This script renders LaTeX math expressions on any website using KaTeX, with inline delimiters and display delimiters. It provides a toggle button to switch rendering on/off.

Disclaimer: ChatGPT did a lot of the work here, but I still verified and edited everything.

Disclaimer: multiline code is not (yet?) supported.

🔧 Features:

Renders both inline and display math expressions

Highlights the rendered expression in color for easy recognition

Supports multiple delimiter styles: [;...;], \(...\), and $...$ for inline and \[...\] and $$...$$ for display. You can easily edit the script to add your own or change which delimiter is used for what.

Toggle button lets you enable/disable rendering whenever you want

Auto-hides buttons when holding CTRL for unobtrusive browsing

Only displays the button when a valid delimiter is detected on the page

Leaves , , and editable fields untouched while rendering is ON

Minimal and fast — scans efficiently and only activates when LaTeX is detected

⚠️ Caution: Always turn LaTeX rendering OFF before typing into input fields or rich text editors. Rendering changes the DOM and could interfere with form content if left on while editing.

"Fix Input Field" button restores LaTeX expressions from rendered KaTeX, useful if rendering was accidentally left ON while editing and the content got messed up

⚙️ Installation:

Get the Tampermonkey extension (Chrome, FireFox)

Install this script in Tampermonkey

Edit the script to your preferences. Most of the things you'd want to change are in lines 18-51.

🧪 Test:

Here is some text with LaTeX in it so you can test the script (adapted from Reddit comments here)

This is an inline piecewise function $ f(x) = \left\{ \begin{array}{ll} 1 & \mbox{ if } x=0 \\ 2 & \mbox{ otherwise} \end{array} \right. $

This is an inline matrix [; M = \left( \begin{array}{cc} 1 & 2 \\ 3 & 4 \end{array} \right) ;]

This is an inline continued fraction \( 1 + \frac{1}{2 + \frac{1}{ 3 + \frac{1}{4 + \frac{1}{5}} }} \)

This is an inline sum $(f*g)(n) = \sum\limits_{d | n} f(d) \cdot g\left(\frac{n}{d}\right)$

This is a display equation \[ e^{i \pi}=\cos\pi+i\sin\pi=-1+0i=-1\blacksquare \]

This is a display sum $$(f*g)(n) = \sum\limits_{d | n} f(d) \cdot g\left(\frac{n}{d}\right)$$

This is the first piecewise function, when written by a user that does not know that the \ character has some issues when sites like Reddit already formats it $ f(x) = \left{ \begin{array}{ll} 1 & \mbox{ if } x=0 \ 2 & \mbox{ otherwise} \end{array} \right. $