Convertisseur Image en Base64
Déposez, collez ou choisissez une image et copiez un data URI prêt pour le HTML, le CSS ou le Markdown. Dans l'autre sens, collez du Base64 ou un data URI pour voir l'image, vérifier son vrai type et télécharger le fichier.
L'image est lue et convertie dans votre navigateur. Elle n'est envoyée à aucun serveur et n'est pas enregistrée sur la page.
Résultat
Pas encore d'image
Choisissez une image ou collez une capture avec Ctrl+V. Le code s'affiche ici dans le format choisi.
Vous avez un Base64 qui n'est pas une image, un en-tête Basic ou un Secret Kubernetes ? Le décodeur Base64 lit le texte et tout type de fichier.
Qu'est-ce qu'un data URI
Un data URI place le fichier dans l'adresse elle-même : data:image/png;base64, suivi des octets de l'image en Base64. Le navigateur traite ce texte comme une URL d'image, il fonctionne donc dans le src d'une balise img, dans url() en CSS, en Markdown et en JSON. La partie avant la virgule indique le type du fichier ; s'il est faux, certains navigateurs et validateurs d'envoi refusent l'image.
Quand intégrer l'image et quand l'éviter
À intégrer
Icônes et logos de quelques Ko, qui coûteraient chacun une requête
Petites images de fond dans un CSS critique, chargé avec la page
Fixtures de test et mocks d'API, où l'image doit voyager dans le JSON
Mieux en fichier
Photos et bannières : le Base64 est plus gros d'un tiers et le navigateur ne le met pas en cache séparément de la page
L'image principale de la page, car un HTML plus lourd retarde tout ce qui suit
Les images d'e-mailing, que Gmail et Outlook sous Windows n'affichent pas en data URI
Le SVG n'a pas besoin de Base64
Le SVG est du texte : il peut aller dans un data URI avec du percent-encoding, en échappant seulement <, >, # et %. Le résultat est souvent plus léger que le Base64 et reste lisible. Les guillemets doubles deviennent simples pour que la valeur tienne dans url("...") en CSS. Choisissez URL-encoded dans les options quand l'image est un SVG.
Tester les envois et les API avec des images en Base64
Beaucoup d'API reçoivent l'image en Base64 dans le JSON, avec ou sans le préfixe data:. En QA, deux points comptent. La limite de taille s'applique souvent au fichier décodé, et le Base64 est environ 33 % plus gros : une photo de 5 Mo devient environ 6,7 Mo de payload. Ensuite, le type : si le data URI indique image/png et que les octets sont du JPEG, un backend qui vérifie la signature du fichier le refuse. Le mode Base64 en image montre les deux types côte à côte.
Formats affichés par le navigateur
PNG, JPEG, GIF, WebP, AVIF, SVG, ICO et BMP s'affichent dans tout navigateur récent. Le HEIC, format des photos d'iPhone, ne s'ouvre que dans Safari ; ici il est converti et téléchargé normalement, mais l'aperçu peut ne pas s'afficher.
Questions fréquentes sur les images en Base64
Data URI, e-mail, SVG, envois et images qui ne s'ouvrent pas.