Equation Builder
Use $...$ or $$...$$ to enter LaTeX into the tooltip box.
Use $...$ or $$...$$ to enter LaTeX into the tooltip box.
Our Equation Builder allows you to build, save, share and embed LaTeX equations with HTML tooltips.
Some knowledge of LaTeX and HTML is required in order to use our equation builder effectively.
to save this equation
Already have an account?
These HTML tags are allowed inside the tooltip box. Unsupported tags are removed automatically. Images display at
full width by default, and LaTeX can be entered using $...$ or $$...$$. Inline styles
support a safe subset for colour, typography, spacing, width, borders, and alignment.
<h1>Main heading</h1>
<h2>Section heading</h2>
<h3>Small heading</h3>
<b>Bold</b> and <strong>Strong</strong>
<i>Italic</i> and <em>Emphasis</em>
<u>Underline</u>, <s>Strikethrough</s>, <small>Small note</small>
<span style="color:#894eef;">Purple text</span> <p style="background-color:#f2eaff;">Tinted note</p>
Tinted note
H<sub>2</sub>O and x<sup>2</sup>
<p>First paragraph.</p> <p>Second paragraph.</p>
First paragraph.
Second paragraph.
Line one<br>Line two
<div>Block wrapper with a <span>span highlight</span>.</div>
<div style="margin:0 auto; width:100%; text-align:center;"> <h2>Centered tooltip heading</h2> </div>
<blockquote>Important reminder or definition.</blockquote>
Important reminder or definition.
<p style="padding:8px; border:1px solid #c6daec; border-radius:6px;"> Styled note </p>
Styled note
Allowed style properties: color, background-color, text-align, font-size, font-style, font-weight, line-height, text-decoration, margin, padding, width, min-width, max-width, display, border, border-color, border-width, border-style, border-radius, grid-template-columns, align-items, gap, column-gap, row-gap, white-space
Layout-affecting styles such as position, z-index, transform, url(), var(), and calc() are removed.
<tt-max-width='500px'>
Increases the tooltip maximum width, which is 350px by default.
<img data-tooltip-side="right" src="https://example.com/image.png" alt="Example">
Use left or right to make the first marked image fill that side of the tooltip. Later marked images stay inline.
<ul> <li>Bullet one</li> <li>Bullet two</li> </ul>
<ol> <li>Step one</li> <li>Step two</li> </ol>
<table>
<caption>Values</caption>
<tr>
<th>Symbol</th>
<th>Meaning</th>
</tr>
<tr>
<td>m</td>
<td>Mass</td>
</tr>
</table>
| Symbol | Meaning |
|---|---|
| m | Mass |
<td colspan="2">Shared value</td>
| Term | Note |
|---|---|
| Shared value | |
<code>F = ma</code>
F = ma<pre>line 1 line 2</pre>
line 1 line 2
$E = mc^2$
$...$ or $$...$$ to render LaTeX inside the tooltip.<a href="https://example.com">Reference link</a>
<img src="/images/logos/eqicon.png" alt="Example icon">
LaTeX (pronounced Lay-tek) is a text-based way of writing mathematical equations. Commands such as
\frac, \sqrt, or ^2, are formatted as mathematical symbols.
EQBuilder uses the KaTeX library to render LaTeX, which supports a wide range of LaTeX commands. You can find a full list of supported commands on the KaTeX documentation page linked below.