Aller au contenu
/ TikZ → SVG

TikZ → SVG

Collez votre code TikZ : il est compilé par un vrai moteur LaTeX, directement dans votre navigateur, et transformé en image SVG nette à toutes les tailles, prête à coller dans WordPress.

Exemples :
Préambule (facultatif)

Vos commandes et bibliothèques TikZ. Packages déjà chargés : tikz, amsmath, amssymb ; pgfplots, tkz-tab et tikz-cd sont ajoutés automatiquement s'ils sont utilisés, ainsi que les raccourcis d'Otoolia (\R, \conj{A}, \proba…).

ou Ctrl + Entrée

Aperçu

L'aperçu apparaîtra ici.

Corriger une figure déjà publiée

Collez ici tout le contenu du bloc « HTML personnalisé » (le code TikZ est gardé en commentaire au début du bloc) :

Utiliser la figure dans WordPress

  • Coller le bloc HTML (recommandé) : ajoutez un bloc « HTML personnalisé » et collez le bloc copié. Aucune image à téléverser, aucune extension. Le code TikZ est gardé dans le bloc, en commentaire invisible pour les visiteurs : pour corriger une coquille, recollez le bloc dans « Corriger une figure déjà publiée ». Il faut un compte administrateur (WordPress retire le code SVG collé par les autres rôles).
  • Téléverser le fichier .svg : WordPress refuse les SVG par défaut ; installez l'extension « Safe SVG », puis insérez le fichier avec un bloc « Image ».

La figure s'adapte à la largeur de l'écran, reste nette à tous les zooms, et plusieurs figures peuvent cohabiter dans la même page. Elle fonctionne aussi sur n'importe quel site ou dans un fichier HTML.

Questions fréquentes

Mon code est-il envoyé sur un serveur ?

Non. Le moteur TeX (TikZJax, TeX compilé en WebAssembly) tourne dans votre navigateur. Il pèse environ 7 Mo, téléchargés une seule fois à la première génération ; votre navigateur le garde ensuite.

Quels packages puis-je utiliser ?

TikZ et toutes ses bibliothèques (\usetikzlibrary{…} dans le préambule), pgfplots, tkz-tab, tikz-cd, tikz-3dplot, amsmath, amssymb, array. Les autres packages ne sont pas disponibles dans le moteur en ligne : pour eux, compilez sur votre ordinateur (latex puis dvisvgm --no-fonts).

Pourquoi le SVG pèse-t-il 40 à 80 Ko ?

Les polices de LaTeX utilisées par la figure sont intégrées au fichier, pour qu'il s'affiche à l'identique partout sans rien charger d'autre. Une fois compressé par le serveur web, il pèse environ deux fois moins.

La figure ne compile pas : que faire ?

L'outil signale les erreurs les plus courantes (accolades ou parenthèses non fermées, point-virgule manquant, environnement mal fermé). Une commande personnelle doit être définie dans le préambule. Pour mettre au point une figure complexe, l'assistant LaTeX d'Otoolia génère arbres, tableaux de variations et courbes sans erreur.

Moteur : TikZJax (David Grice, d'après Jim Fowler), licence GPL-3.0 ; package tkz-tab d'Alain Matthes.

Exemple : publier une courbe sur un blog de maths

  1. Chargez l'exemple « Courbe (pgfplots) », ou collez votre propre code, par exemple :
    \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}
  2. Choisissez la taille (× 1,3 pour s'accorder avec des formules affichées par MathJax) et rédigez une courte description pour les lecteurs d'écran (« parabole d'équation y = x² »).
  3. Générez (Ctrl + Entrée), vérifiez l'aperçu, puis copiez le bloc HTML et collez-le dans un bloc « HTML personnalisé » de WordPress.

Pourquoi du SVG plutôt qu'une image PNG ?

Si la figure ne se génère pas

Bon à savoir

Le code n'est envoyé à aucun serveur : la compilation se fait dans votre navigateur, en WebAssembly. Pour créer une figure sans écrire de TikZ (arbre de probabilités, tableau de variations, courbe), commencez par l'assistant LaTeX, puis convertissez le code obtenu ici.

Guide rédigé et vérifié par Erwan Hautot · mis à jour le 30 octobre 2026.