FR

Coloration syntaxique

Cet outil de coloration syntaxique colore le code source sans rien installer : collez votre code, choisissez le langage et un thème clair ou sombre, puis copiez le HTML obtenu. Les couleurs sont intégrées au balisage, de sorte que le code s’affiche correctement dans les blogs, e-mails et documents sans feuille de style supplémentaire.

Source : WCAG 2.2 – Success Criterion 1.4.3 Contrast (Minimum): 4,5:1 pour le texte (couleurs des deux thèmes vérifiées). Mise à jour : .

Collez du code source. La coloration de l’aperçu se met à jour à chaque saisie.

Votre texte reste dans votre navigateur : il n’est ni envoyé, ni enregistré, ni ajouté à l’adresse de la page.

Aperçu

// Afficher un message de bienvenue
function greet(name) {
  const text = "Bonjour, " + name + " !";
  console.log(text);
  return text.length;
}

greet("monde");
Ma boîte à outils

Résultat

HTML coloré
<pre style="background:#ffffff;color:#1f2328;padding:12px 14px;border-radius:6px;overflow:auto;font:13px/1.5 ui-monospace,SFMono-Regular,Menlo,Consolas,'Liberation Mono',monospace;tab-size:4;margin:0"><code style="font:inherit"><span style="color:#57606a;font-style:italic">// Afficher un message de bienvenue</span> <span style="color:#cf222e">function</span> <span style="color:#8250df">greet</span>(name) { <span style="color:#cf222e">const</span> text = <span style="color:#0a3069">"Bonjour, "</span> + name + <span style="color:#0a3069">" !"</span>; console.<span style="color:#8250df">log</span>(text); <span style="color:#cf222e">return</span> text.length; } <span style="color:#8250df">greet</span>(<span style="color:#0a3069">"monde"</span>);</code></pre>
Détecté
JavaScript / TypeScript, 8 lignes, 162 caractères
Le HTML contient les couleurs sous forme d’attributs style et peut être collé partout où le HTML est accepté. La détection est une approximation fondée sur des motifs, pas un analyseur complet ; avec une syntaxe inhabituelle, un passage peut rester sans couleur. Le code est traité uniquement dans votre navigateur, il n’est ni enregistré ni envoyé.

Comment le calcul est fait

La coloration syntaxique met en couleur les éléments du code source : mots-clés, chaînes, nombres, commentaires et noms de fonctions reçoivent chacun une couleur. Le code devient plus lisible, surtout dans des textes, des documentations et des e-mails, où l’on n’a pas d’éditeur avec thème de couleurs.

Ce que sait faire l’outil

Sûr et sans perte

Le code source n’est pas modifié : il est seulement découpé en sections et entouré d’indications de couleur. Les caractères comme < et & sont échappés pour que du code contenant des fragments HTML n’influence pas le reste de la page. Pour mettre le code en forme au préalable, utilisez le formateur JSON, le formateur SQL ou le formateur HTML.

Questions fréquentes

Comment colorer du code pour un article de blog ?

Collez le code, choisissez le langage et le thème, puis copiez le HTML du champ de résultat. Insérez-le dans l’éditeur du blog comme bloc HTML. Les couleurs sont dans le balisage, aucune feuille de style supplémentaire n’est nécessaire.

Puis-je coller le code coloré dans Word ou un e-mail ?

Oui, en général depuis l’aperçu : sélectionnez, copiez et collez, les couleurs sont conservées. Dans les logiciels qui n’acceptent pas le HTML, une capture d’écran de l’aperçu dépanne.

Quels langages sont pris en charge ?

JavaScript et TypeScript, JSON, HTML avec script et style intégrés, CSS, SQL, Python et Bash. Pour tout autre langage, choisissez « Texte brut » ; seule la mise en forme du bloc reste alors.

Mon code est-il enregistré ou envoyé ?

Non. Le traitement se fait dans votre navigateur. Le code n’apparaît pas dans l’adresse et n’est pas enregistré.

Pourquoi certains passages ne sont-ils pas colorés ?

L’outil reconnaît des motifs comme les mots-clés, chaînes et commentaires, mais n’est pas un analyseur complet. Une syntaxe inhabituelle ou une variante de langage reste donc parfois en noir.

Sources et références juridiques

Dernière mise à jour : · Principes éditoriaux

Outils similaires