Loading builder...
You have reached the equation save limit on your account type. Please upgrade to enable equation saving.

Equation Builder

Click on the equation to add a tooltip
Selected Atom:
none
ID: none
Enable tooltip for selected atom

Use $...$ or $$...$$ to enter LaTeX into the tooltip box.

Live Preview (Adobe Acrobat Reader)

Category Selector +
Category Selector (Curated) +
Persistent Embed Mode: On
LaTeX package required
  1. Download eqbuilder.sty and place it in the same folder as your .tex document
  2. Add this to your tex document preamble: \usepackage{eqbuilder}
  3. Copy the LaTeX output below into your document, then compile with PDFLaTeX
Synchronising LaTeX tooltip annotations

Need help?

Equation Builder Tour

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.

1 / 10

Share Equation

Public URL to this equation:

Equation JPEG preview

Create an account

to save this equation

New?

Password strength

Already have an account?

Equation Save Limit Reached

Go to My Account

Tooltip HTML Help

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 h2 h3 b strong i em u s small sub sup p br hr div span blockquote table caption thead tbody tfoot tr th td colgroup col ul ol li code pre a img tt-max-width

Headings

<h1>Main heading</h1>

Main heading

<h2>Section heading</h2>

Section heading

<h3>Small heading</h3>

Small heading

Text Styling

<b>Bold</b> and <strong>Strong</strong>
Bold and Strong
<i>Italic</i> and <em>Emphasis</em>
Italic and Emphasis
<u>Underline</u>, <s>Strikethrough</s>, <small>Small note</small>
Underline, Strikethrough, Small note
<span style="color:#894eef;">Purple text</span>
<p style="background-color:#f2eaff;">Tinted note</p>
Purple text

Tinted note

H<sub>2</sub>O and x<sup>2</sup>
H2O and x2

Layout

<p>First paragraph.</p>
<p>Second paragraph.</p>

First paragraph.

Second paragraph.

Line one<br>Line two
Line one
Line two
<div>Block wrapper with a <span>span highlight</span>.</div>
Block wrapper with a span highlight.
<div style="margin:0 auto; width:100%; text-align:center;">
  <h2>Centered tooltip heading</h2>
</div>

Centered tooltip heading

<blockquote>Important reminder or definition.</blockquote>
Important reminder or definition.

Inline Styles

<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.

Tooltip Commands

<tt-max-width='500px'>

Increases the tooltip maximum width, which is 350px by default.

Side Images

<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.

Lists

<ul>
  <li>Bullet one</li>
  <li>Bullet two</li>
</ul>
  • Bullet one
  • Bullet two
<ol>
  <li>Step one</li>
  <li>Step two</li>
</ol>
  1. Step one
  2. Step two

Tables

<table>
  <caption>Values</caption>
  <tr>
    <th>Symbol</th>
    <th>Meaning</th>
  </tr>
  <tr>
    <td>m</td>
    <td>Mass</td>
  </tr>
</table>
Values
Symbol Meaning
m Mass
<td colspan="2">Shared value</td>
Term Note
Shared value

Code and Math

<code>F = ma</code>
F = ma
<pre>line 1
line 2</pre>
line 1
line 2
$E = mc^2$
Use $...$ or $$...$$ to render LaTeX inside the tooltip.

Links and Images

<a href="https://example.com">Reference link</a>
Reference link
<img src="/images/logos/eqicon.png" alt="Example icon">
Example icon

LaTeX Help

What is LaTeX?

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.

View KaTeX Supported Functions (opens new tab)