Différence entre Data URI et Base64 brut ?

Un data URI (`data:image/png;base64,…`) va dans `src` ou `url()` CSS. Le Base64 brut est uniquement les octets après la virgule, quand une API refuse le préfixe `data:`.

Faut-il intégrer de grandes images en e-mail ou HTML ?

En général non. Base64 grossit d’environ un tiers et beaucoup de clients limitent la taille. Préférez des URL hébergées pour les photos ; réservez l’inline aux petites icônes.

L’image est-elle téléversée ?

Non. FileReader lit le fichier localement ; rien ne quitte votre appareil.

Convient-il aux signatures e-mail françaises ?

Oui pour de petites icônes. Évitez les photos : le Base64 alourdit le message et peut dépasser les plafonds.

Utill.net

Image vers Base64

URI de données

Téléchargez une image et convertissez-la en URI de données Base64 pour l'intégrer directement dans HTML, CSS ou JavaScript sans requêtes HTTP supplémentaires.

Cette conversion s’exécute uniquement dans votre navigateur — rien n’est téléversé.

Glissez une image ou parcourez ci-dessous

PNG, JPEG, GIF, SVG, WebP · max. 10 Mo

Parcourir les fichiers

Pour le Base64 de texte UTF-8 (pas les images), utilisez Encodeur et décodeur Base64

Qu'est-ce que cet outil ?

Lit une image locale via FileReader et produit un data URI (data:image/…;base64,…) ou du Base64 brut (payload seul). L’aperçu confirme le fichier avant la copie.

Pratique pour petites icônes, démos autonomes et fixtures de test. Base64 grossit d’environ un tiers et contourne le cache URL : les grandes photos vont sur un CDN / hôte statique, pas dans le HTML ou l’e-mail.

Maximum 10 Mo. Si vous devez inliner, restez sous quelques centaines de Ko.

Cas d'usage courants

Construire un src d’img ou background-image: url(…) sans requête séparée
Intégrer un petit logo dans un e-mail / signature HTML (surveillez la taille totale)
Produire des fixtures Base64 pour tests sans committer de binaires

Comment utiliser

Glissez une image ou parcourez (PNG, JPEG, GIF, SVG, WebP · max. 10 Mo).
Vérifiez l’aperçu et les pastilles MIME / taille.
Choisissez Data URI ou Base64 brut, puis Copier.
Sample charge un PNG 1×1 ; Clear réinitialise.

Exemples

Usage	Forme	Notes
Image HTML	`<img src="data:image/png;base64,…" alt="">`	Onglet Data URI ; icônes minuscules.
Fond CSS	`background-image: url("data:image/svg+xml;base64,…")`	SVG souvent compact.
Champ API	Base64 sans préfixe `data:`	Onglet Raw.
Grande photo en e-mail	URL hébergée, pas Base64	Limites des clients mail.

Pièges courants

Taille e-mail : Base64+MIME peut dépasser Gmail/Outlook ; hébergez les photos, inline uniquement des micro-icônes.
Les grands data URI coûtent en mémoire et rendu ; l’UI avertit au-delà d’~500 Ko.
Images uniquement. Le Base64 texte UTF-8 est un autre outil.

Références

Dernière révision: 2026-07-27

Questions fréquentes

Différence entre Data URI et Base64 brut ?: Un data URI (`data:image/png;base64,…`) va dans `src` ou `url()` CSS. Le Base64 brut est uniquement les octets après la virgule, quand une API refuse le préfixe `data:`.
Faut-il intégrer de grandes images en e-mail ou HTML ?: En général non. Base64 grossit d’environ un tiers et beaucoup de clients limitent la taille. Préférez des URL hébergées pour les photos ; réservez l’inline aux petites icônes.
L’image est-elle téléversée ?: Non. FileReader lit le fichier localement ; rien ne quitte votre appareil.
Convient-il aux signatures e-mail françaises ?: Oui pour de petites icônes. Évitez les photos : le Base64 alourdit le message et peut dépasser les plafonds.