References

Beginner-friendly references for web development, with live, editable examples.

The HTML <math> tag

Element All modern browsers Updated
Quick answer

The <math> element is the root of MathML — markup for mathematical and scientific notation that browsers render natively (no images or libraries). It contains MathML elements like <mrow>, <mfrac>, <msup> and <mi>.

Overview

The <math> element embeds MathML (Mathematical Markup Language) inline in HTML, letting the browser render equations natively. Unlike an image of an equation, native MathML is accessible to screen readers, scalable, and selectable as text — a real upgrade for any page with mathematics.

Inside it, the building blocks are small, semantic elements: identifiers go in <mi>, numbers in <mn>, operators in <mo>, fractions in <mfrac>, superscripts in <msup>, and <mrow> groups expressions. MathML Core reached Baseline support in 2023, so it works across current browsers.

Authoring complex MathML by hand is verbose, so in practice many people generate it from LaTeX with a tool rather than writing it manually. The payoff is worth it: native rendering is the most accessible way to present math on the web.

Syntax

<math>
  <msup><mi>x</mi><mn>2</mn></msup>
</math>

Example

Live example
<math>
  <mrow>
    <mi>E</mi><mo>=</mo><mi>m</mi><msup><mi>c</mi><mn>2</mn></msup>
  </mrow>
</math>

Best practices

  • Use <math> for accessible, scalable equations rather than images of equations.
  • Build expressions from the semantic children — <mi>, <mn>, <mo>, <mfrac>, <msup>, <mrow>.
  • Generate complex MathML from LaTeX with a tool rather than writing it by hand.
  • Provide a text alternative for any audience where MathML support is uncertain.

Accessibility

Native MathML is the accessible way to present mathematics: assistive technology can read the structure of an equation, which is impossible with an image. Always prefer <math> over a picture of a formula.

Frequently asked questions

What is the math element?
The root element for MathML, which embeds mathematical notation that the browser renders natively.
Why use MathML instead of an image of an equation?
MathML is accessible to screen readers, scales without blurring, and can be selected as text — none of which an image offers.
Is MathML supported in browsers?
Yes. MathML Core reached Baseline support in 2023 and works in current major browsers.
How do I write MathML?
Compose it from elements like <mi>, <mn> and <mfrac>, or — for complex equations — generate it from LaTeX with a conversion tool.