README
mathpix-markdown-it
What is Mathpix Markdown?
mathpix-markdown is a superset of Markdown that adds helpful syntax for the STEM community, such as advanced equation, table, and chemistry support. Wherever possible, we borrow syntax from LaTeX. In other cases (such as chemistry) we invent new syntax that is backward compatible with Markdown.
Here are the key benefits over plain Markdown:
- better equation support via LaTeX syntax (powered by MathJax), including equation numbering and referencing conventions from LaTeX
- better support for tables, via the LaTeX tabular syntax, which allows for complex, nested tables often seen in scientific publications
- advanced figure referencing via LaTeX syntax
- support for abstracts, author lists, and linkable sections; these are a fact of life for academic publications
- support for chemistry diagrams represented with SMILES markup, compatible with popular chemistry tools like Chemdraw
Mathpix Markdown Syntax reference
Click here for the full syntax reference.
How to edit mmd files?
Mathpix Markdown is an open format with multiple implementations:
- you can use this Github repo and the
mathpix-markdown-it
npm library to render STEM content on your website - you can use the VS Code plugin (see picture above) to edit mmd files
- use can use our web editor Snip Notes to edit, export, and publish mmd files (with exports to pdf and docx formats)
- you can use our experimental static site generator Spectra to edit local mmd files and see changes in real time
How is Mathpix Markdown different from regular Markdown?
Mathpix Markdown addresses these limitations by adding support for the following standard Latex syntax elements which are already familiar to the scientific community:
- inline math via
\( <latex math> \)
- block math via
\[ <latex math> \]
or$ <math> $
- tables via
\begin{tabular} ... \end{tabular}
- figures and figure captions via
\begin{figure} \caption{...} ... \end{figure}
- lists: unordered lists via
\begin{itemize} ... \end{itemize}
and ordered lists via\begin{enumerate} ... \end{enumerate}
- numbered and unnumbered equation enviornments
\begin{elem} ... \end{elem}
and\begin{elem*} ... \end{elem*}
where elem=equation|align|split|gather
- equation, table, and figure references via
\label
,\ref
,\eqref
,\tag
- text formatting options
\title{...}
,\author{...}
,\begin{abstract}...\end{abstract}
,\section{Section Title}
,\subsection{Section Title}
,\subsubsection{Section Title}
,\textit{italicized text}
,\textbf{bold text}
,\url{link}
- chemistry equation via
<smiles>OC(=O)c1cc(Cl)cs1</smiles>
or
```smiles
OC(=O)c1cc(Cl)cs1
```
What is mathpix-markdown-it?
mathpix-markdown-it is an open source implementation of the mathpix-markdown spec written in Typescript.
It relies on the following open source libraries:
- MathJax v3 (to render math with SVGs)
- markdown-it (for standard Markdown parsing)
Quickstart
Installation
npm usage:
$ npm install mathpix-markdown-it
yarn usage:
$ yarn add mathpix-markdown-it
How to use
React usage
mathpix-markdown-it components usage
We provide React components which make rendering of mathpix-markdown-it easy for React applications: Full example
import {MathpixMarkdown, MathpixLoader} from 'mathpix-markdown-it';
class App extends Component {
render() {
return (
<MathpixLoader>
<MathpixMarkdown text="\\(ax^2 + bx + c = 0\\)"/>
<MathpixMarkdown text="$x = \frac { - b \pm \sqrt { b ^ { 2 } - 4 a c } } { 2 a }