<math-field>

The Math Editor for the Web

---

A flexible, powerful, and accessible way to write math on the web.

---

math-field { border: 1px solid var(--neutral-400); background: var(--neutral-200); border-radius: 8px; padding: 8px; } @media (pointer: coarse) { math-field { border-radius: 16px; font-size: 1.25rem; border: 1px solid var(--neutral-100); background: var(--neutral-700); --primary-color: white; color: white; padding: 16px; box-shadow: inset 4px 4px 16px rgb(0 0 0 / 10%), inset 2px 2px 8px rgb(0 0 0 / 60%); --smart-fence-color: white; --caret-color: var(--blue-400); --selection-background-color: var(--blue-300); --contains-highlight-background-color: var(--blue-900); } math-field:focus { outline: 4px solid rgb(255 255 255 / 25%); } math-field::part(virtual-keyboard-toggle), math-field::part(menu-toggle) { color: white; } }

<p>Start typing math below:</p> <math-field> x=\frac{-b\pm\sqrt{b^2-4ac}}{2a} </math-field>

Why MathField?

Built on LaTeX

The gold standard, for beautiful math typesetting.

Read more about the 800+ LaTeX commands supported by mathfields

Math Virtual Keyboards

Fully customizable and makes math input easy on desktop and mobile.

Read more about the virtual keyboard

Open Source & Extensible

MathField is an open source project available on GitHub. Contributions are welcome.

View the project on GitHub

Individuals and commercial partners can contribute financially to the project.

Donate on PayPal

What Can You Do with MathField?

E-Learning Made Engaging

Enable interactive math quizzes, exercises, and problem-solving tools that check answers in real-time

Read this step-by-step tutorial to learn how to build a simple quiz with mathfield

Learn more about authoring fill-in-the-blank questions with mathfields

Scientific Computing & Research

Render complex formulas and let users symbolically manipulate equations.

Use mathfields with the Compute Engine to symbolically compute and manipulate equations

Interactive Online Calculators

Build real-time calculators that evaluate math expressions dynamically

Make your calculator interactive by using the Compute Engine to evaluate the user's input

Beautiful Math Documentation

Embed math seamlessly in blogs, wikis, and papers, ensuring clarity and readability