Comment convertir une image en Base64
- Déposez une image dans la zone, cliquez pour en choisir une ou collez-la depuis le presse-papiers avec Ctrl+V.
- Choisissez le format de sortie : data URI, Base64 brut, HTML, CSS, Markdown ou JSON.
- Cliquez sur Copier et collez le code dans votre HTML, votre CSS, votre modèle d'e-mail ou votre requête API.
Quand intégrer des images en Base64 ?
Une image intégrée en Base64 économise une requête HTTP, ce qui est pratique pour les petites icônes, les signatures d'e-mail, les documents HTML autonomes (en un seul fichier) et les données envoyées aux API. Comme le Base64 pèse environ 33 % de plus que le fichier d'origine et ne peut pas être mis en cache séparément, conservez des fichiers image classiques pour les photos et tout ce qui dépasse quelques kilo-octets.
Les formats de sortie en détail
- Data URI –
data:image/png;base64,…pour les attributssrcet le CSS. - Base64 seul – la chaîne brute, pour les API et les bases de données.
- HTML / CSS / Markdown – des extraits complets, prêts à coller.
- JSON – nom du fichier, type MIME et données réunis dans un seul objet.
Questions fréquentes
La conversion en Base64 alourdit-elle l'image ?
Oui, d'environ un tiers. Un PNG de 30 Ko devient environ 40 Ko de texte Base64. Si le poids compte, compressez ou redimensionnez l'image au préalable.
Quels formats d'image puis-je convertir ?
Tous les formats que votre navigateur sait ouvrir : PNG, JPG/JPEG, GIF, WebP, SVG, BMP, ICO, AVIF, etc. Le type MIME approprié est ajouté automatiquement à la data URI.
Comment utiliser une image Base64 en CSS ?
Choisissez le format CSS et collez le résultat dans votre règle, par exemple .logo { background-image: url("data:image/png;base64,…"); }.