HTML et Markdown, dans les deux sens, au même endroit
Deux formats que les développeurs jonglent au quotidien. Markdown pour les README, la doc, les issues GitHub, le chat. HTML pour les vraies pages web, les templates d'email, tout ce qu'un navigateur affiche. La traduction entre les deux est fastidieuse à la main et dangereuse en regex : les éléments block s'imbriquent, les balises inline se chevauchent, les fences de code avalent les backticks. Cet outil fait passer la conversion par de vrais parsers côté serveur : `turndown` pour HTML vers Markdown, `marked` pour Markdown vers HTML.
Collez votre contenu à gauche, regardez la sortie convertie apparaître à droite avec un aperçu en direct du résultat rendu. Activez GitHub Flavored Markdown (tableaux, code fence, strikethrough), gardez ou supprimez le HTML brut en allant vers Markdown, activez les guillemets typographiques pour une typographie propre.
Tout tourne côté serveur, c'est un choix volontaire : un vrai DOM et un vrai lexer markdown battent à tous les coups les regex côté navigateur, et la sortie est assainie avant de quitter la route, donc l'aperçu n'a jamais l'occasion d'héberger un `<script>` égaré.
Mode d'emploi
- Choisissez une direction en haut : HTML to Markdown pour porter un billet de blog vers un README, ou Markdown to HTML pour obtenir un corps d'email à partir d'un fichier de doc.
- Collez votre source dans le champ d'entrée à gauche, ou cliquez sur Load sample pour voir un exemple fonctionnel avec un tableau et un bloc de code.
- Le champ de sortie se met à jour après une courte pause (environ 350 ms), assez long pour fusionner les frappes, assez court pour paraître en direct.
- Utilisez l'interrupteur GitHub Flavored Markdown pour activer les tableaux, les fences de code et les listes de tâches. Laissez-le activé pour quasi tous les cas d'usage modernes.
- Activez Preserve raw HTML en allant HTML vers Markdown si votre source utilise des balises que Markdown ne sait pas exprimer (par exemple `<kbd>`, `<sup>`, `<details>`) : elles restent telles quelles au lieu d'être perdues.
- Smart quotes remplace les guillemets droits par des guillemets typographiques et trois points par une vraie ellipse. Désactivez quand la sortie part dans un éditeur de code qui n'aime pas l'Unicode.
- Cliquez sur Swap direction pour un aller-retour : la sortie actuelle devient la nouvelle entrée et la direction s'inverse. Utile pour vérifier qu'aucune donnée n'a été perdue.
- Cliquez sur Copier pour mettre la sortie dans le presse-papiers, ou sur Coller pour importer du HTML ou du Markdown directement depuis votre presse-papiers sans quitter la page.
Quand c'est utile
Six situations concrètes où ça fait gagner un vrai temps :
- Import d'un billet de blog dans un README. Vous avez rédigé un long article dans votre CMS (sortie en HTML), vous le voulez en Markdown dans le repo. Collez, choisissez HTML to Markdown, copiez. Tableaux et blocs de code survivent au voyage.
- Envoi d'une page de doc en email. Vous avez un fichier Markdown dans le repo, votre service d'email transactionnel veut du HTML. Convertissez une fois, collez le corps HTML dans le template.
- Nettoyage d'un collage en rich text. Word, Notion et Google Docs collent tous du HTML alourdi avec des styles inline, des wrappers span et une soupe de classes. Collez ici, choisissez HTML to Markdown, obtenez une chaîne propre avec juste la structure : titres, listes, liens, code.
- Migration d'un CMS. L'ancien site exporte du HTML, le nouveau (Hugo, Astro, content collection Next.js) lit du Markdown. Conversion en masse page par page, on garde la structure, on largue les styles inline.
- Rédaction d'issues GitHub avec tableaux. Vous avez ébauché un tableau comparatif quelque part en HTML, vous le voulez en vrai tableau GFM dans une issue. Collez, convertissez, collez dans GitHub. Le bazar des pipes est généré pour vous.
- Vérification du rendu Markdown. Vous avez écrit un long README et voulez voir à quoi il ressemblera sur GitHub. Collez dans Markdown to HTML, regardez l'aperçu en direct. Si une fence de code casse ou un tableau est mal aligné, l'aperçu vous le dit immédiatement. Pour assembler le README lui-même, allez au générateur de README ; pour le travail uniquement sur tableaux, l'éditeur de tableaux Markdown est plus rapide ; et pour les longs docs, attrapez une TOC Markdown.