Image → Base64
Encodez une image en data URI Base64 pour CSS ou HTML.
- Instantané
- Gratuit
- Privé (traité localement)
- Sans inscription
- Taille du fichier
- —
- Taille encodée
- —
Image volumineuse : un data URI de cette taille alourdit la page. Préférez un fichier classique au-delà de quelques dizaines de Ko.
Traité localement : votre image ne quitte pas l’appareil.
Encodez une image en Base64 en deux secondes
Le data URI permet d’incorporer une image directement dans votre code, sans fichier externe. Déposez votre image, choisissez le format de sortie — data URI brut, propriété CSS ou balise HTML — et copiez le résultat.
-
Déposez votre image
PNG, JPG, WebP, GIF, SVG… tout format d’image est accepté et conservé tel quel : aucune réencodage, aucune perte.
-
Choisissez la sortie
Data URI brut, background-image CSS prêt à coller, ou balise <img> HTML complète.
-
Copiez
Un clic sur Copier et le code est dans votre presse-papiers, avec les tailles avant/après affichées.
Quand utiliser (et éviter) le Base64
| Situation | Data URI ? | Pourquoi |
|---|---|---|
| Icône ou logo < 10 Ko | Oui | Économise une requête HTTP, affichage immédiat |
| E-mail HTML | Oui | Les images externes sont souvent bloquées par défaut |
| Photo ou bannière > 100 Ko | Non | +33 % de poids, pas de cache séparé, rendu ralenti |
| Image répétée sur plusieurs pages | Non | Un fichier classique est mis en cache une seule fois |
Astuce : pour les icônes vectorielles, le SVG inline (collé directement dans le HTML) est souvent plus léger et plus net que sa version Base64.
Questions fréquentes
Qu’est-ce qu’un data URI ?
C’est une URL qui contient directement les données du fichier, au format data:image/png;base64,iVBOR… Elle s’utilise partout où une URL d’image est attendue : attribut src, background-image CSS, favicon…
Pourquoi encoder une image en Base64 ?
Pour incorporer l’image directement dans le HTML, le CSS ou un JSON, sans fichier séparé ni requête HTTP supplémentaire. C’est pratique pour les petites icônes, les e-mails HTML ou les prototypes autonomes.
Le Base64 augmente-t-il la taille du fichier ?
Oui, d’environ 33 % par rapport au fichier binaire d’origine. C’est le prix de la représentation en texte. La compression gzip/brotli du serveur en récupère une partie, mais un fichier classique reste plus efficace pour les grosses images.
Jusqu’à quelle taille est-ce une bonne idée ?
En règle générale, réservez le data URI aux images de moins de quelques dizaines de Ko (icônes, logos, petits motifs). Au-delà, il gonfle vos pages, bloque la mise en cache séparée et ralentit le rendu.
Mon image est-elle envoyée quelque part ?
Non. La lecture et l’encodage sont réalisés par l’API FileReader de votre navigateur. L’image ne quitte jamais votre appareil.