Image en Base64

Nouveau

Convertissez n'importe quelle image en chaîne URL de données Base64

Outils développeur

Comment utiliser Image en Base64

  1. 1Upload your image
  2. 2Copy the generated Base64 string
  3. 3Paste it into your HTML img src, CSS background-image, or JSON payload
  4. 4Collez-le directement dans votre HTML ou CSS

À propos de Image en Base64

Image vers Base64 convertit votre fichier image en une chaîne de texte Base64 pouvant être intégrée directement dans les balises HTML img, les arrière-plans CSS ou les charges utiles JSON — sans fichier image séparé. L'outil affiche l'URL de données complète, la portion Base64 pure et un extrait HTML exemple.

L'encodage Base64 est la technique standard pour intégrer des données d'image binaires dans des formats texte. Il est utilisé partout : templates d'e-mails HTML, fichiers CSS, réponses d'API JSON et fichiers SVG. Cet outil automatise la conversion instantanément dans votre navigateur.

Fonctionnalités clés de Image en Base64

  • Conversion instantanée sans aller-retour serveur
  • Sortie URL de données complète prête à coller dans les attributs src HTML
  • Sortie chaîne Base64 pure pour les API JSON et intégrations personnalisées
  • Extrait de balise HTML img prêt en un clic
  • Bouton de copie dans le presse-papiers pour chaque section de sortie
  • Supporte tous les formats d'image que le navigateur peut afficher
  • Pas de restriction de taille de fichier au-delà de la mémoire du navigateur
  • Entièrement côté client — vos données d'image ne quittent jamais votre appareil

Formats supportés

Formats d'entrée

PNGJPGWEBPGIFSVGBMPICO

Formats de sortie

Chaîne URL de données Base64Chaîne Base64 bruteExtrait HTML img

L'URL de données de sortie inclut automatiquement le préfixe de type MIME correct (data:image/png;base64, etc.).

Exemples

Icône inline dans un e-mail HTML

Intégrez l'icône directement dans le HTML de votre e-mail pour qu'elle s'affiche même quand les images externes sont bloquées.

Entrée

Petite icône PNG 32x32

Sortie

data:image/png;base64,iVBOR... (URL de données complète)

Image d'arrière-plan CSS

Utilisez l'URL de données dans une propriété CSS background-image pour éviter une requête HTTP supplémentaire.

Entrée

Petite texture PNG décorative

Sortie

background-image: url("data:image/png;base64,...")

Image dans une réponse d'API JSON

Copiez la chaîne Base64 brute comme valeur d'un champ "avatar" dans une charge utile JSON sans le préfixe d'URL de données.

Entrée

Avatar PNG utilisateur

Sortie

Chaîne Base64 brute pour valeur de champ JSON

Cas d'utilisation courants

  • Intégrer de petites icônes directement dans HTML pour éviter des requêtes HTTP supplémentaires
  • Inclure des images en ligne dans CSS pour les graphiques d'arrière-plan
  • Stocker des données d'image dans des charges utiles JSON ou des fichiers de configuration
  • Créer des modèles d'e-mail HTML autonomes avec des images intégrées
  • Encoder des images de signature pour les intégrer dans des scripts de génération PDF
  • Regrouper de petits sprites directement dans les fichiers source JavaScript

Dépannage

La chaîne de sortie est extrêmement longue et ralentit l'éditeur

Solution

L'encodage Base64 augmente la taille d'environ 33%. Pour les images de plus de 100 Ko, envisagez de les servir comme fichiers normaux.

L'URI de données ne s'affiche pas dans le navigateur

Solution

Assurez-vous que l'URI de données inclut le préfixe MIME correct, ex: "data:image/png;base64," — l'outil le génère automatiquement, vérifiez la troncature accidentelle.

L'encodage SVG produit une sortie corrompue

Solution

Pour les fichiers SVG, l'encodage URL est parfois plus fiable que Base64. Utilisez la source SVG brute ou encodez la chaîne SVG en URL.

Questions fréquemment posées

Pourquoi utiliser Base64 pour les images ?

Les images encodées en Base64 peuvent être intégrées directement dans HTML, CSS ou JSON sans héberger l'image comme fichier séparé.

Base64 augmente-t-il la taille du fichier ?

Oui, l'encodage Base64 augmente la taille de la chaîne brute d'environ 33%. Il est plus approprié pour les petites images comme les icônes de moins de 10 Ko.

Quelle est la différence entre l'URL de données et la chaîne Base64 brute ?

L'URL de données inclut le préfixe de type MIME (ex. data:image/png;base64,). La chaîne Base64 brute est juste les données encodées sans ce préfixe.

Y a-t-il une limite de taille de fichier ?

Il n'y a pas de limite côté serveur car tout l'encodage se fait dans votre navigateur. Les images jusqu'à 10 Mo s'encodent de manière fiable sur les appareils modernes.

Quels formats d'image sont supportés ?

Tout format que votre navigateur peut charger : PNG, JPG, WEBP, GIF, SVG, BMP et ICO sont tous supportés.

Puis-je utiliser la sortie Base64 dans CSS ?

Oui. Utilisez l'URL de données complète comme valeur d'une propriété CSS background-image.

Puis-je utiliser la sortie Base64 dans une API JSON ?

Oui. Copiez la chaîne Base64 brute (sans le préfixe d'URL de données) pour l'utiliser comme valeur d'un champ image dans une charge utile JSON.

Que se passe-t-il avec la transparence dans la sortie Base64 ?

La transparence est entièrement préservée quand la source est un PNG ou WEBP avec un canal alpha.