Package Exports
- mathlive
- mathlive/dist/mathlive.core.css
- mathlive/dist/mathlive.css
- mathlive/dist/mathlive.mjs
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (mathlive) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme


MathLive is a JavaScript library to render and edit math.
- Tex-quality typesetting
- Easy to use interface for math editing
- Fast and small
- Works great on desktop and on mobile devices thanks to an extensive set of virtual keyboards
- Outputs LaTeX, MathML and JSON (Abstract Syntax Tree, MASTON)**
- And it is easy to customize to your needs!
Try it at mathlive.io
![]() |
![]() |
![]() |
How To Use MathLive
To display math
You can use MathLive to simply render math equations by adding a few lines to your web page.
<!doctype html><html lang="en-US">
<head>
...
<link rel="stylesheet" href="https://unpkg.com/mathlive/dist/mathlive.core.css">
<link rel="stylesheet" href="https://unpkg.com/mathlive/dist/mathlive.css">
<script src="https://unpkg.com/mathlive"></script>
</head>
<body>
<h1>Euler's Identity</h1>
<p>$$e^{i\pi} + 1 = 0$$</p>
<script>
MathLive.renderMathInDocument();
</script>
</body>
</html>
To edit math
You can also incorporate a “math field” to edit math just like you would edit text. The MathLive APIs allow you to interact with the math field, including extracting its content, inserting placeholders and more.
<!doctype html><html lang="en-US">
<head>
...
<link rel="stylesheet" href="https://unpkg.com/mathlive/dist/mathlive.core.css">
<link rel="stylesheet" href="https://unpkg.com/mathlive/dist/mathlive.css">
</head>
<body>
<div id='mathfield'>f(x)=</div>
<script type='module'>
import MathLive from 'https://unpkg.com/mathlive/dist/mathlive.mjs';
MathLive.makeMathField('mathfield');
</script>
</body>
</html>
More examples
More examples are available at https://mathlive.io/deploy/examples/
Installing MathLive
The examples above use a CDN, which is the fastest and easiest way to get started. However, if you:
- want to contribute to MathLive
- use your own CDN
- make some other changes to MathLive you can also install it locally in your project.
To do so:
$ npm install -s mathlive
$ npm start
This will make a local build of MathLive, run a local HTTP server and open a page with the examples in your browser.
How You Can Help
- Something wrong? Got ideas for new features? Write up an issue. Read about Contributing and follow our Code of Conduct
- Want to use MathLive in your web page? The Usage Guide has all the details.
- Want to contribute some code for an issue or a feature? Read the Contributor Guide and the docs. Looking for inspiration? Pick one of the good first issues
More Questions?
- Join our Slack channel at https://mathlive.slack.com.
- Drop a line to arno@arno.org or /u/real_arnog
License
This project is licensed under the MIT License.