TikZ → SVG
Paste your TikZ code: it is compiled by a real LaTeX engine, right in your browser, and turned into an SVG image that stays crisp at any size, ready to paste into WordPress.
Preamble (optional)
Your commands and TikZ libraries. Already loaded: tikz, amsmath, amssymb; pgfplots, tkz-tab and tikz-cd are added automatically when used, as are Otoolia's shortcuts (\R, \conj{A}, \proba…).
Preview
The preview will appear here.
Fix a figure you already published
Paste the whole content of the “Custom HTML” block here (the TikZ code is kept as a comment at the start of the block):
Using the figure in WordPress
- Paste the HTML block (recommended): add a “Custom HTML” block and paste the copied block. No image to upload, no plugin. The TikZ code is kept in the block as a comment, invisible to visitors: to fix a typo, paste the block back into “Fix a figure you already published”. You need an administrator account (WordPress strips SVG code pasted by other roles).
- Upload the .svg file: WordPress refuses SVG by default; install the “Safe SVG” plugin, then insert the file with an “Image” block.
The figure adapts to the screen width, stays crisp at any zoom, and several figures can share a page. It also works on any website or in an HTML file.
Frequently asked questions
Is my code sent to a server?
No. The TeX engine (TikZJax, TeX compiled to WebAssembly) runs in your browser. It weighs about 7 MB, downloaded once on the first generation; your browser keeps it afterwards.
Which packages can I use?
TikZ and all its libraries (\usetikzlibrary{…} in the preamble), pgfplots, tkz-tab, tikz-cd, tikz-3dplot, amsmath, amssymb, array.
Other packages are not available in the online engine: for those, compile on your computer (latex then dvisvgm --no-fonts).
Why is the SVG 40 to 80 KB?
The LaTeX fonts used by the figure are embedded in the file, so it displays identically everywhere without loading anything else. Once compressed by the web server, it is about half that size.
The figure does not compile: what now?
The tool points out the most common mistakes (unclosed braces or parentheses, missing semicolon, environment not closed). Custom commands must be defined in the preamble. To build a complex figure, Otoolia's LaTeX assistant generates trees, variation tables and plots without errors.
Engine: TikZJax (David Grice, after Jim Fowler), GPL-3.0 licence; tkz-tab package by Alain Matthes.
Example: publishing a graph on a maths blog
- Load the “Curve (pgfplots)” example, or paste your own code, for instance:
\begin{tikzpicture} \begin{axis}[axis lines=middle, xmin=-3, xmax=3, ymin=-1, ymax=9] \addplot[blue, thick, domain=-3:3, samples=100] {x^2}; \end{axis} \end{tikzpicture} - Choose the size (× 1.3 to match formulas rendered by MathJax) and write a short description for screen readers (“parabola y = x²”).
- Generate (Ctrl + Enter), check the preview, then copy the HTML block and paste it into a WordPress “Custom HTML” block.
Why SVG rather than PNG?
- Sharpness: SVG is vector-based, perfect on Retina screens, when zoomed and in print.
- Size: a figure usually weighs 40–80 KB including fonts, often less than a high-resolution PNG.
- Fidelity: the figure is compiled by a real TeX engine with LaTeX fonts; it matches your handouts exactly.
- Editable: the TikZ code is kept as a comment in the block; to fix a typo, just retrieve it.
If the figure won't generate
- Package not available: only TikZ and its libraries, pgfplots, tkz-tab, tikz-cd, tikz-3dplot, amsmath, amssymb and array are loaded. For others, compile on your computer (
latexthendvisvgm --no-fonts). - Unknown custom command: add your
\newcommandlines in the optional preamble. - Missing library:
\usetikzlibrary{arrows.meta, calc}in the preamble. - Slow first run: the TeX engine (about 7 MB) downloads once, then stays cached by the browser.
Good to know
Your code is not sent to any server: compilation happens in your browser, in WebAssembly. To build a figure without writing TikZ (probability tree, variation table, graph), start with the LaTeX assistant, then convert its code here.
Guide written and checked by Erwan Hautot · updated 30 October 2026.