Éditeur Markdown en ligne — Aperçu en direct, HTML
Un éditeur Markdown en direct avec un HTML assaini à copier ou enregistrer
Traitement dans le navigateur · aucun envoi de fichier
Si l’option est activée, votre texte est conservé uniquement dans ce navigateur (jamais envoyé à un serveur). La désactiver efface le texte enregistré.
Aperçu
Chargement du moteur d’aperçu…
Le HTML de l’aperçu est toujours assaini : les scripts, les attributs d’événement, les liens javascript:, les iframes et les formulaires sont supprimés. Si votre texte contient des adresses d’images, votre navigateur charge ces images directement depuis leur adresse.
Présentation
L’aperçu Markdown affiche le rendu à côté de votre texte pendant que vous tapez. Pratique pour relire un README, un brouillon d’article de blog, une documentation technique ou un compte rendu de réunion avant publication. Les titres, listes, citations et blocs de code fonctionnent, tout comme les extensions GitHub Flavored Markdown : tableaux, texte barré et listes de tâches. Le résultat est toujours assaini avant affichage, si bien que coller un texte de provenance inconnue n’exécute aucun script.
Mode d’emploi
- Tapez ou collez du Markdown dans la zone de gauche. Un court exemple s’y trouve au départ, et le bouton Effacer la vide.
- L’aperçu à droite se met à jour peu après la fin de la saisie. Vérifiez à l’œil l’alignement des tableaux et les listes imbriquées.
- Appuyez sur Copier le HTML pour placer le fragment HTML assaini dans le presse-papiers, prêt pour un éditeur en mode HTML ou un modèle d’e-mail.
- Enregistrer en .md télécharge votre texte d’origine. Enregistrer en .html télécharge un document HTML complet avec une feuille de style simple. Le nom du fichier est tiré de votre premier titre de niveau 1.
- Pour reprendre plus tard, activez l’option de brouillon. Le texte est conservé uniquement dans ce navigateur.
Fonctionnement
- Analyseur : marked (licence MIT) convertit le texte en HTML selon la spécification GFM. Comme le veut la norme, un simple retour à la ligne ne crée pas de saut de ligne, sauf si la ligne se termine par deux espaces ou est suivie d’une ligne vide.
- Assainissement : DOMPurify (Apache-2.0 ou MPL-2.0, utilisé ici sous Apache-2.0) nettoie le HTML avant affichage. Les balises script, iframe, object, form et style, les attributs d’événement commençant par on, les attributs style et les liens en javascript: ou data: sont supprimés.
- Liens : les liens restants s’ouvrent dans un nouvel onglet avec rel=“noopener noreferrer”.
- Cases à cocher : celles des listes de tâches sont toujours désactivées, l’aperçu est donc en lecture seule.
- Images : les adresses d’images sont laissées telles quelles, votre navigateur les demande donc directement à leurs serveurs, qui peuvent voir cette requête.
- Fichiers : le .md est votre texte exact en UTF-8. Le .html est un document UTF-8 avec un attribut lang et une feuille de style minimale.
Exemples
| Vous tapez | Vous obtenez |
|---|---|
**gras** |
gras |
~~barré~~ |
|
- [x] fait |
une case cochée suivie de « fait » |
[lien](https://example.com) |
un lien qui s’ouvre dans un nouvel onglet |
[clic](javascript:alert(1)) |
l’adresse est supprimée, seul le texte reste |
<script>alert(1)</script> |
rien ne s’exécute |
Voici un tableau. Les deux-points de la deuxième ligne fixent l’alignement.
| Article | Qté |
|:---|---:|
| Pomme | 3 |Questions fréquentes
Mon texte Markdown est-il envoyé à un serveur ?
Non. Le rendu et l’assainissement se font dans votre navigateur, et rien de ce que vous tapez n’est envoyé. Le texte n’est conservé dans ce navigateur que si vous activez l’option de brouillon, et la désactiver l’efface. Seule réserve : si votre texte pointe vers une image externe, votre navigateur charge cette image directement depuis son adresse.
Une balise script dans mon texte va-t-elle s’exécuter ?
Non. Le HTML rendu passe toujours par DOMPurify avant d’être affiché, ce qui supprime les balises script, les attributs d’événement comme onclick et onerror, les liens javascript, les iframes, les formulaires et les balises style. Le HTML que vous copiez ou téléchargez est la version assainie.
Comment écrire un tableau ou une liste de tâches ?
Pour un tableau, séparez les colonnes par des barres verticales et placez une ligne de tirets sous l’en-tête. Deux-points à gauche de cette ligne signifient aligné à gauche, deux-points à droite aligné à droite. Pour une liste de tâches, commencez un élément de liste par - [ ] ou - [x]. L’aperçu affiche des cases à cocher en lecture seule. Ce sont deux extensions de GitHub Flavored Markdown.
Le rendu sera-t-il identique à GitHub ou à mon blog ?
La syntaxe est interprétée de la même façon, mais les polices, les espacements et les couleurs dépendent de chaque service. Servez-vous de cette page pour vérifier que votre Markdown est bien compris comme prévu. Le fichier .html téléchargé ne contient qu’une feuille de style simple et lisible.
Quelle longueur de texte est acceptée ?
Jusqu’à 500 000 caractères. Au-delà, l’aperçu se met en pause et affiche un avertissement : collez les documents très longs par morceaux.
