Image en Base64
Transformez une image en code Base64 à coller directement dans du HTML, du CSS, du JSON ou un modèle d’e-mail.
ou déposez-le ici · jusqu’à 50 Mo, gratuitement
Fichiers plus volumineux ? Pro convertit des fichiers jusqu’à 500 MoAu-delà des limites gratuites : vous pourrez débloquer le téléchargement dès 1,99 €.
Traitement en cours…
Votre fichier est prêt
Gratuit · Sans inscription · Sans filigrane · Vos fichiers ne quittent jamais votre appareil
Image en Base64 en 3 étapes
- Sélectionnez votre image, ou déposez-la dans le cadre.
- Choisissez le résultat : data URI, Base64 seul, CSS ou balise HTML.
- Cliquez sur Convertir en Base64, puis copiez le code ou téléchargez-le en fichier .txt.
Quand intégrer une image en Base64
Le Base64 écrit les octets d’un fichier sous forme de texte : une image peut ainsi vivre dans une page HTML, une feuille de style, des données JSON ou une signature d’e-mail au lieu d’être un fichier séparé. Cela économise une requête pour les petites icônes et les logos, et c’est le seul moyen d’envoyer une image via certaines API et certains champs de formulaire qui n’acceptent que du texte.
Le prix à payer, c’est la taille : le texte Base64 pèse environ un tiers de plus que l’image et ne peut pas être mis en cache séparément. Réservez-le aux images de quelques kilo-octets et gardez les photos en fichiers normaux. Pour un code le plus court possible, compressez d’abord l’image, ou utilisez le SVG pour les logos et icônes, qui restent nets à toutes les tailles.
Questions fréquentes
Comment convertir une image en Base64 ?
Sélectionnez une image ici, choisissez le format du résultat et cliquez sur Convertir en Base64. Le code apparaît dans un cadre avec un bouton Copier, et vous pouvez aussi le télécharger en fichier .txt. Cela fonctionne avec les images JPG, PNG, GIF, WebP, SVG, AVIF, BMP et ICO.
Qu’est-ce qu’un data URI ?
Un data URI, c’est le texte Base64 précédé d’un court préfixe qui indique au navigateur le type de fichier, comme data:image/png;base64, suivi du code. Vous pouvez l’utiliser partout où l’on attend l’URL d’une image, par exemple dans le src d’une balise img ou dans url() en CSS.
Comment utiliser le Base64 en HTML ou en CSS ?
Choisissez « Balise HTML <img> » pour obtenir un élément img prêt à l’emploi, ou « CSS background-image » pour obtenir une ligne à coller dans une règle de style. Les deux contiennent le data URI complet : l’image s’affiche sans fichier séparé.
Pourquoi le Base64 est-il plus lourd que l’image ?
Le Base64 utilise 4 caractères de texte pour 3 octets : le code est donc environ 33 % plus lourd que le fichier. Ce n’est pas gênant pour de petites icônes, mais cela grossit vite pour des photos. Compressez ou redimensionnez d’abord l’image si le code est trop long.
Mon image est-elle envoyée sur un serveur ?
Non. L’image est lue et encodée dans votre navigateur, sur votre propre appareil : elle ne nous est jamais envoyée et n’est stockée nulle part. Une fois la page chargée, l’outil continue de fonctionner même sans connexion internet.