Softonic

Aperçu Markdown

Étape 1 / 2
Suivant

Tapez à gauche, regardez le rendu HTML à droite. L’aperçu parle Markdown GitHub-flavored : tables, listes de tâches, blocs de code délimités avec coloration syntaxique, barré, URLs auto-liées et HTML en ligne. Utile pour rédiger un README avant de le valider, vérifier à quoi ressemblera un commentaire sur une PR, ou simplement apprendre la syntaxe Markdown en regardant chaque frappe se rendre.

Comment utiliser l'aperçu

  1. 1

    Écrire en Markdown

    Le panneau de gauche prend du Markdown brut. Chaque changement re-rend instantanément le panneau de droite.

  2. 2

    Regarder l'aperçu HTML

    Le panneau de droite montre la sortie rendue stylée comme sur GitHub.

  3. 3

    Changer de mode

    Vue côte à côte, uniquement aperçu, ou uniquement source pour une écriture sans distraction.

  4. 4

    Copier le HTML

    Récupérez le HTML rendu si vous devez le coller dans un client email ou un CMS.

Ce que cet aperçu prend en charge

  • CommonMark : titres, paragraphes, emphase, listes, citations, blocs de code, liens, images, règles horizontales.
  • Extensions GFM : tables avec alignement des colonnes, listes de tâches (- [ ] et - [x]), barré avec ~~, URLs auto-liées et blocs de code délimités avec des indications de langue.
  • Coloration syntaxique : 100+ langues via highlight.js, JavaScript, Python, Go, Rust, SQL, YAML, etc.
  • HTML brut : HTML en ligne est transmis (sanitisé pour la sécurité).
  • Mathématiques (optionnel) : $...$ en ligne et $$...$$ bloc si vous activez l’extension mathématique.

Non pris en charge

  • Wikilinks personnalisés de style Obsidian ([[Page]]), ceux-ci sont uniquement pour Obsidian.
  • Divisions délimitées Pandoc (:::), uniquement pour Pandoc.
  • Inclusions côté serveur ou balises de modèle {% ... %}.

Utilisations typiques

  • Rédiger un README en dehors de l’IDE et coller la version finale.
  • Vérifier le formatage des commentaires PR avant de poster, la boîte de commentaire de GitHub ne prévisualise pas correctement les blocs de code.
  • Convertir des notes en HTML lorsque vous devez coller du contenu stylé dans un email ou un CMS qui accepte du HTML brut.
  • Enseigner le Markdown, la vue côte à côte rend la syntaxe évidente.

Performance

Le rendu utilise un parseur Markdown-it avec le plugin GFM, fonctionnant entièrement dans le navigateur. Les documents de quelques centaines de Ko se rendent en millisecondes ; les très grands (un livre entier dans un seul fichier) peuvent ramer pendant que vous tapez, divisez-les en chapitres si cela se produit.

Exportation

  • Copier HTML vous donne le <div> avec le contenu rendu, classes stylées incluses.
  • Télécharger .md sauvegarde la source.
  • Imprimer en PDF depuis la boîte de dialogue d’impression de votre navigateur produit une copie PDF stylée de la vue rendue.

Questions fréquentes

GitHub applique son propre CSS en plus de GFM. La sortie HTML devrait correspondre ; le style (polices, espacement) est le leur. Pour une parité exacte, utilisez le commutateur de thème “rendu sur GitHub”.

Oui si vous activez l’extension mathématique, en ligne $...$ et bloc $$...$$ se rendent avec KaTeX. C’est désactivé par défaut pour garder le poids de la page léger.

Il est sanitisé, des balises sûres comme <div>, <span>, <table>, <img> passent ; <script> et les gestionnaires d’événements en ligne sont supprimés.

Des centaines de Ko fonctionnent sans problème. Pour des fichiers très volumineux, désactivez le rendu en direct et rendez à la demande.

Le rendu est entièrement côté client. Le contenu n’est envoyé nulle part. Si vous rafraîchissez la page, les brouillons sont perdus à moins que le navigateur ne préserve l’état du formulaire.

Outils similaires

Référence de la table ASCII

Table ASCII complète de 0 à 127 avec décimal, hexadécimal, octal, binaire et référence numérique HTML pour chaque caractère, y compris les codes de contrôle comme NUL, LF et DEL.

Référence des caractères HTML

Liste consultable des entités HTML, de leurs codes nommés et numériques, et un copier-coller en un clic pour les caractères et symboles spéciaux.

Compteur de FPS

Mesurez les FPS du navigateur avec requestAnimationFrame : lissage, fréquence d'images min et max, seuil d'alerte et graphique facultatif. Tout se passe en local, sans envoi ni API.

Référence des raccourcis clavier

Recherchez les raccourcis par défaut documentés de VS Code, Chrome et Bash avec GNU Readline sous macOS, Windows et Linux.

Générateur de carte CSS

Créez le CSS d’un conteneur de carte : fond, bordure, rayon des angles, espacement intérieur et ombre douce, avec aperçu immédiat et code à copier-coller.

Générateur de flèches CSS

Créez localement une flèche CSS avec direction, couleur, taille et épaisseur de bordure, puis copiez la règle.

Outil disponible dans d’autres langues