Markdown vers HTML
Collez du Markdown à gauche, voyez le HTML rendu (ou son code source) à droite. Exécution en direct dans votre navigateur.
- Saisissez ou collez du Markdown à gauche.
- L'aperçu à droite se met à jour au fil de la frappe.
- Basculez Affichage sur Source HTML pour voir les balises plutôt que le rendu.
- Cliquez sur Copier le HTML pour le mettre dans le presse-papiers, ou Télécharger .html pour un fichier autonome.
Que fait-il ?
Cet outil convertit le Markdown en HTML avec CommonMark plus GitHub Flavored Markdown (GFM), les sauts de ligne intra-paragraphe étant rendus en <br>. Vous pouvez voir le rendu ou basculer sur la vue Source HTML pour inspecter les balises générées. Le résultat est prêt à être collé dans une plateforme de blog, un éditeur d'e-mails ou partout où HTML est accepté.
Exemple
Markdown en entrée :
# Release notes
We shipped **three** things this week:
- [x] Faster cold start
- [ ] Dark mode (next week)
See the [docs](https://example.com/docs) for details.
```js
console.log("hello");
``` Source HTML rendue :
<h1>Release notes</h1>
<p>We shipped <strong>three</strong> things this week:</p>
<ul>
<li><input type="checkbox" checked disabled> Faster cold start</li>
<li><input type="checkbox" disabled> Dark mode (next week)</li>
</ul>
<p>See the <a href="https://example.com/docs">docs</a> for details.</p>
<pre><code class="language-js">console.log("hello");
</code></pre> Erreurs courantes et pièges
La plupart des surprises de rendu Markdown viennent d'une poignée de pièges de syntaxe. Si l'aperçu semble faux, la cause est souvent l'une de celles-ci.
- Ligne vide manquante avant une liste. "Texte d’intro\n- élément" est rendu comme un seul paragraphe. Laissez une ligne vide entre l'intro et le premier élément.
- Bloc de code indenté alors que vous vouliez un paragraphe. Quatre espaces en tête transforment la ligne en bloc de code. Supprimez l'indentation ou utilisez un bloc ``` explicite.
- Tableau cassé. Chaque tableau GFM exige une ligne séparatrice (| --- | --- |) avec au moins trois tirets par colonne et le même nombre de barres verticales sur chaque ligne.
- Lien avec espaces dans l'URL. [clic](ma page.html) casse le parseur. Encodez l'espace en %20 ou utilisez des chevrons : <ma page.html>.
- Astérisques à l'intérieur des mots. wild*card peut ou non être rendu en emphase selon le contexte. Échappez avec une barre oblique inverse : wild\*card.
- Échappement HTML dans les blocs de code. Les extraits contenant < apparaissent littéralement parce qu'ils sont déjà échappés. Collez la source brute avant échappement.
Questions fréquentes
Quelle variante de Markdown est prise en charge ?
CommonMark plus GitHub Flavored Markdown (GFM). Cela couvre les tableaux, les blocs de code délimités, les listes de tâches, le barré et les URLs auto-liées. Les sauts dans un paragraphe deviennent des balises <br> parce que l'option breaks est activée — c'est comme le rendu des commentaires GitHub et de la plupart des messageries.
Le HTML dans mon Markdown est-il assaini ?
Non. Le rendu laisse passer le HTML brut par défaut. Ainsi, <details> ou <kbd> continuent de fonctionner. Ne collez pas de Markdown non fiable et n'en copiez pas le résultat sur un site public sans le passer d'abord par un sanitiseur comme DOMPurify.
Les notes de bas de page, maths ou diagrammes sont-ils pris en charge ?
Non. C'est du GFM pur. Les notes de bas de page, les maths (KaTeX/MathJax) et les diagrammes Mermaid sont des extensions GitHub ou de plateforme et ne sont pas rendus ici. Si vous en avez besoin, utilisez un moteur de rendu Markdown configuré avec les plugins voulus, ou collez la sortie dans une plateforme qui les prend en charge.
Que se passe-t-il quand je clique sur Copier le HTML ?
Le code HTML rendu est écrit dans votre presse-papiers via l'API Clipboard. Vous obtenez le HTML sans le chrome de la page — juste les balises correspondant à votre Markdown. Collez-le dans un CMS, un éditeur d'e-mails ou directement dans un fichier. Aucun fichier n'est créé sur le disque.
Pourquoi mes tableaux paraissent-ils désalignés ?
Les tableaux GFM exigent une ligne d'en-tête, une ligne séparatrice avec au moins trois tirets par colonne, et des barres verticales entre cellules. Une barre manquante ou une séparatrice avec seulement deux tirets échoue silencieusement. Passez à la vue source HTML pour vérifier si un <table> a bien été produit.
Enregistrez-vous le Markdown collé ici ?
Non. Nous ne gardons ni le Markdown saisi ou collé, ni le HTML téléchargé. Tout est supprimé à la fermeture ou au rafraîchissement de l'onglet — aucun journal, aucune trace de ce que vous avez écrit. Vérifiez-le dans les outils de développement de votre navigateur.