Create web articles and blog posts with equations and diagrams

Upmath significantly simplifies this task by using Markdown and LaTeX. It converts Markdown syntax extended with LaTeX equations support into HTML code you can publish anywhere on the web.

Definition from Wikipedia:

Markdown is a lightweight markup language with plain text formatting syntax designed so that it can be converted to HTML and many other formats using a tool by the same name. Markdown is often used to format readme files, for writing messages in online discussion forums, and to create rich text using a plain text editor.

The main idea of Markdown is to use a simple plain text markup. It's hard easy to make bold or italic text. Simple equations can be formatted with subscripts and superscripts: E0=mc^2^. I have added the LaTeX support: $$E_0=mc^2$$.

Among Markdown features are:

• images (see above);
• links: service main page;
• code: untouched equation source is *E*~0~=*mc*^2^;
• unordered lists--when a line starts with +, -, or *;
  1. sub-lists
  2. and ordered lists too;
• direct use of HTML–for anything else.

In addition, Upmath supports typographic replacements: (c) (r) (tm) +- !!!!!! ???? ,, -- ---

Upmath converts LaTeX equations in double-dollars $$: $$ax^2+bx+c=0$$. All equations are rendered as block equations. If you need inline ones, you can add the prefix \inline: $$\inline p={1\over q}$$. Place big equations on separate lines:

$$x_{1,2} = {-b\pm\sqrt{b^2 - 4ac} \over 2a}.$$

In this case the LaTeX syntax will be highlighted in the source code. You can even add equation numbers (unfortunately there is no automatic numbering and refs support):

$$|\vec{A}|=\sqrt{A_x^2 + A_y^2 + A_z^2}.$$(1)

It is possible to write Cyrillic symbols in \text command: $$Q_\text{плавления}>0$$.

One can use matrices:

$$T^{\mu\nu}=\begin{pmatrix} \varepsilon&0&0&0\\ 0&\varepsilon/3&0&0\\ 0&0&\varepsilon/3&0\\ 0&0&0&\varepsilon/3 \end{pmatrix},$$

integrals:

$$P_\omega={n_\omega\over 2}\hbar\omega,{1+R\over 1-v^2}\int\limits_{-1}^{1}dx,(x-v)|x-v|,$$

cool tikz-pictures:

$$\usetikzlibrary{decorations.pathmorphing} \begin{tikzpicture}[line width=0.2mm,scale=1.0545]\small \tikzset{>=stealth} \tikzset{snake it/.style={->,semithick, decoration={snake,amplitude=.3mm,segment length=2.5mm,post length=0.9mm},decorate}} \def\h{3} \def\d{0.2} \def\ww{1.4} \def\w{1+\ww} \def\p{1.5} \def\r{0.7} \coordinate[label=below:$A_1$] (A1) at (\ww,\p); \coordinate[label=above:$B_1$] (B1) at (\ww,\p+\h); \coordinate[label=below:$A_2$] (A2) at (\w,\p); \coordinate[label=above:$B_2$] (B2) at (\w,\p+\h); \coordinate[label=left:$C$] (C1) at (0,0); \coordinate[label=left:$D$] (D) at (0,\h); \drawfill=blue!14--(B2)-- ++(\d,0)-- ++(0,-\h)--cycle; \drawgray,thin-- +(\w+\d,0); \drawdashed,gray,fill=blue!5-- (B1)-- ++(\d,0)-- ++(0,-\h)-- cycle; \drawdashed,line width=0.14mm--(C1)--(D)--(B1); \drawsnake it--(A2) node[pos=0.6,below] {$c\Delta t$}; \draw->,semithick-- +(\w-\ww,0) node[pos=0.6,above] {$v\Delta t$}; \drawsnake it--(B2); \drawthin arc (0:atan2(\p,\w):\r) node[midway,right,yshift=0.06cm] {$\theta$}; \drawopacity=0-- ++(0,5.06); \end{tikzpicture}$$

plots:

$$\begin{tikzpicture}[scale=1.0544]\small \begin{axis}[axis line style=gray, samples=120, width=9.0cm,height=6.4cm, xmin=-1.5, xmax=1.5, ymin=0, ymax=1.8, restrict y to domain=-0.2:2, ytick={1}, xtick={-1,1}, axis equal, axis x line=center, axis y line=center, xlabel=$x$,ylabel=$y$] \addplot[red,domain=-2:1,semithick]{exp(x)}; \addplot[black]{x+1}; \addplot[] coordinates {(1,1.5)} node{$y=x+1$}; \addplot[red] coordinates {(-1,0.6)} node{$y=e^x$}; \path (axis cs:0,0) node [anchor=north west,yshift=-0.07cm] {0}; \end{axis} \end{tikzpicture}$$

and the rest of LaTeX features.

• Upmath works in browsers, except equations rendered on the server. Markdown text is not sent anywhere, and attackers cannot intercept it.
• Upmath stores your text in the browser to prevent the loss of your work in case of software or hardware failures.
• You can create and switch between multiple documents via the "☰ → New" and "☰ → Open" menu.
• Upmath occasionally saves intermediate versions of your texts. They can be restored via the "☰ → Restore from history" menu.
• You can copy or download the text ("☰ → Download source") and the converted code ("⇓" button).
• To print or convert your documents to PDF, use the standard browser print dialog or the "☰ → Print or save PDF" menu.

I have designed and developed this lightweight editor and the service for converting LaTeX equations into SVG pictures to make publishing mathematical texts on the web easy. I consider client-side rendering, the rival technique implemented in MathJax, to be too limited and resource-consuming, especially on mobile devices.

The source code is published on Github under MIT license.

---

Now you can erase this instruction and start writing your own scientific post. If you wish to see the instruction again, use the "☰ → Open instruction" menu.

Have a nice day :)

Roman Parpalak, web developer and UX expert.