Qu'est-ce que Encodeur d'image en Base64 ?

L'encodeur d'image en Base64 convertit les fichiers image (PNG, JPEG, GIF, SVG, WebP) en chaînes de texte encodées en Base64. Intégrez des images directement dans du HTML, CSS ou JSON sans héberger de fichiers séparés — moins de requêtes HTTP et un balisage plus simple.

L'encodeur lit les octets de l'image sur votre appareil et produit huit sorties : Base64 brut, un data URI prêt pour les attributs src=, une balise <img> complète, une déclaration CSS background-image, un lien de favicon HTML, un conteneur XML, un extrait JavaScript avec Image et un objet JSON regroupant le nom du fichier, le type MIME, la taille et le data URI. Activez Optimiser pour redimensionner le plus grand côté et réencoder d'abord en JPEG ou WebP, ce qui peut diviser la chaîne par deux avant de l'intégrer. Déposez ou collez plusieurs images à la fois, chacune obtient sa propre sortie étiquetée. Besoin du sens inverse ? La section Décoder le Base64 en image transforme n'importe quelle chaîne en image visible et téléchargeable. Formats pris en charge : PNG, JPEG, GIF, SVG, WebP, BMP, ICO, AVIF et HEIC jusqu'à 20 Mo chacun.

Comment utiliser

1. Étape 1 — Importez une image en la glissant, en cliquant sur la zone d'import ou en la collant avec Ctrl+V. Pour la réduire d'abord, ouvrez Options d'encodage et définissez une dimension maximale ou une qualité.
2. Étape 2 — Choisissez un format de sortie : Base64 brut, data URI, balise img HTML, background-image CSS, lien de favicon HTML, XML, un extrait JavaScript avec Image ou un objet JSON pour les charges utiles d'API.
3. Étape 3 — Copiez le résultat dans le presse-papiers ou téléchargez-le en fichier texte.

Quand l'utiliser

• Intégrer un petit logo ou une icône dans un mail HTML pour qu'il s'affiche sans hébergement externe.
• Inliner un petit sprite SVG dans une feuille de style pour éviter une requête HTTP bloquante.
• Insérer une image dans un JSON, un claim JWT ou un YAML qui n'accepte pas d'URL externes.

Résultat

Vous disposez d'une icône de logo de 2 Ko à incorporer directement dans un modèle d'e-mail. Importez le fichier PNG, copiez la sortie URI de données et collez-la dans l'attribut src de votre balise img HTML — sans hébergement externe nécessaire.

FAQ

Le codage Base64 augmente-t-il la taille du fichier ?

Oui, d'environ 33%. Base64 représente trois octets binaires par quatre caractères ASCII, donc un PNG de 30 Ko devient à peu près 40 Ko de texte. Cela ne vaut le coup qu'en dessous de 5 Ko, quand on économise une requête HTTP.

Quand faut-il inliner en Base64 plutôt que mettre un lien ?

On inline tout ce qui pèse moins de 4 à 5 Ko, qui apparaît au-dessus de la ligne de flottaison et qui est difficile à mettre en cache (avatars personnels, icônes utilisées une seule fois). On laisse en lien tout ce qui se répète sur plusieurs pages pour profiter du cache.

Pourquoi mon data URI commence-t-il par data:image/png;base64, ?

Ce préfixe est le type MIME. data:image/png indique au navigateur que les octets qui suivent sont du PNG, base64 précise l'encodage, et la virgule sépare l'en-tête du contenu. Sans cela, le décodeur ne peut pas identifier le format.

Peut-on décoder le Base64 et retrouver une image visible ?

Oui. Ouvrez la section « Décoder le Base64 en image » de cette page, collez votre data URI ou le Base64 brut, et l'image s'affiche pour que vous puissiez la télécharger. Le Base64 sûr pour URL (la variante avec - et _) fonctionne aussi.

Faut-il coder les SVG en Base64 ?

Le plus souvent non. Le SVG est déjà du texte, alors l'URL-encoding dans un data URI tient en moins d'octets que le Base64. L'outil accepte tout de même le SVG quand il faut une chaîne unique facile à transporter.

Outils similaires