100% in your browser

FileReader.readAsDataURL — nothing uploaded

Drop an image here or click to browse

PNG · JPG · GIF · WebP · SVG · BMP · AVIF

Outil 100% navigateur

Image en Base64 URI de données instantané.

Déposez une image et obtenez une URI de données prête à l'emploi pour CSS, HTML, JSON ou e-mail. S'exécute directement dans votre navigateur.

Comment convertir

1

Déposez une image

Déposez n'importe quel fichier PNG, JPG, GIF, SVG ou WebP.

2

Copiez l'URI de données

La chaîne complète data:image/...;base64,... apparaît dans la zone de sortie.

3

Collez partout

Utilisez-la dans un url() CSS, une balise <img src> HTML ou une configuration JSON.

Quand utiliser le base64

Petites icônes

Intégrez des icônes de moins de 1 Ko pour éviter une requête réseau.

E-mails HTML

Lorsque vous ne pouvez pas lier des ressources externes.

CSS en ligne

Éliminez la requête HTTP supplémentaire pour les images d'arrière-plan critiques.

Applications hors ligne

Intégrez les images dans le code source pour une utilisation totalement hors ligne.

FAQ

Qu'est-ce que l'encodage d'image en base64 ?

Le base64 encode les données binaires sous forme de texte ASCII, ce qui permet d'intégrer des images directement dans le CSS, le HTML ou le JSON.

Quand utiliser le base64 plutôt qu'une URL ?

Pour les très petites images, les e-mails ou le CSS en ligne. Pour tout ce qui est plus volumineux, utilisez une URL hébergée — le base64 augmente la taille d'environ 33 %.

Pourquoi la chaîne base64 est-elle si longue ?

Le base64 utilise 4 caractères pour 3 octets, soit une surcharge d'environ 33 %.

Y a-t-il un téléchargement de fichier ?

Non. Tout est traité localement via FileReader.readAsDataURL.

Encodage SVG ?

Cela fonctionne. L'encodage d'URL peut parfois être plus léger pour les SVG.

Comment l'utiliser en CSS ?

Collez-le dans un url() — background-image: url('data:image/png;base64,...').

Comment l'utiliser en HTML ?

Placez-le dans un src d'image : <img src="data:image/png;base64,...">.

Y a-t-il une limite de taille ?

Les limites pratiques des navigateurs se situent autour de 2 Mo pour les URI de données en ligne.

Besoin d'une URL hébergée ?

Pour les images de plus de 2 Ko, une URL CDN est plus rapide.

Essayer l'outil d'upload principal