Image en Base64
Déposez n’importe quelle image dans ce convertisseur d’image en Base64 pour obtenir une data URI et des extraits prêts à coller pour HTML, CSS et JavaScript. Les images intégrées économisent des requêtes HTTP pour les petites icônes et sont indispensables pour le HTML monofichier, les modèles d’e-mail et les applications hors ligne.
Comment convertir Image en Base64 en ligne
- Sélectionnez un fichier image ou collez l’URL d’une image.
- Choisissez la sortie : data URI,
<img>, arrière-plan CSS, favicon, JSON et plus. - Cliquez sur Encoder l’image en Base64.
- Prévisualisez l’image et copiez le code.
Autres convertisseurs Image en Base64
Formats de sortie
Choisissez la mise en forme du résultat. Le convertisseur peut renvoyer :
- txt: uniquement la chaîne Base64, prête à coller dans du code, un champ de base de données ou une requête d’API.
- uri: une URI
data:complète, à coller dans la barre d’adresse d’un navigateur ou à utiliser partout où une URL est acceptée. - html img: une balise
<img>avec la data URI danssrc. - css background image: une règle CSS utilisant
background-image: url(data:...). - html favicon: une balise
<link rel="icon">pour un favicon intégré. - html hyperlink: un lien
<a>qui télécharge ou ouvre le fichier intégré. - html iframe: une
<iframe>qui affiche le contenu directement dans la page. - javascript image: JavaScript qui crée un objet
Image. - javascript popup: JavaScript qui ouvre le contenu dans une nouvelle fenêtre.
- json: un objet JSON avec le nom du fichier, le type MIME et les données.
- xml: un élément XML avec les données dans une section CDATA.
Quand intégrer des images en Base64 ?
Intégrez les petites images (moins de 5–10 Ko environ) comme les icônes, logos et images de substitution pour économiser des requêtes. Évitez d’intégrer de grandes photos : elles alourdissent le HTML/CSS, ne peuvent pas être mises en cache séparément et retardent l’affichage. Pour aller plus loin, consultez les data URI expliquées.
Questions fréquentes
Comment convertir une image en Base64 ?
Choisissez votre image, sélectionnez "Data URI" ou "<img>" comme sortie, puis cliquez sur "Encoder l’image en Base64". Copiez le résultat dans votre HTML ou CSS.
Quels formats d’image sont pris en charge ?
Tout format lisible par votre navigateur : PNG, JPG/JPEG, GIF, WebP, SVG, BMP, ICO, AVIF, TIFF et plus encore.
Comment utiliser une image Base64 en HTML ?
Placez la data URI dans l’attribut src : <img src="data:image/png;base64,iVBORw0KGgo..." alt="">.
Commentaires (0)
Une question, une idée ou un bug dans « Image en Base64 » ? Laissez un commentaire, notez l’outil ou répondez aux autres.
Aucun commentaire pour l’instant. Soyez le premier à donner votre avis !