- Base64 vers Image : décoder et télécharger une image

Décoder le Base64 vers une image

Le Base64 est un système d'encodage qui transforme des données binaires — comme une image — en une chaîne de caractères ASCII transportable dans du texte. Il est massivement utilisé pour embarquer des images directement dans du HTML, du CSS, du JSON ou des emails, sans dépendre d'un fichier externe.

Ce convertisseur réalise l'opération inverse de notre convertisseur Image vers Base64 : il prend une chaîne encodée et reconstitue le fichier image d'origine, prêt à être prévisualisé et téléchargé sur votre disque.

Une image encodée en Base64 se présente généralement sous la forme d'un data URI :

data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mNk+M9QDwADhgGAWjR9awAAAABJRU5ErkJggg==

Le data URI se décompose en trois parties :

• data: — le schéma indiquant des données inline.
• image/png;base64 — le type MIME du fichier et l'encodage utilisé.
• La chaîne après la virgule — les données binaires encodées en Base64.

Comment utiliser l'outil

La conversion s'effectue en trois étapes, entièrement dans votre navigateur :

Étape 1 : Coller la chaîne Base64

Collez votre contenu dans la zone de texte. Deux formes sont acceptées :

• Data URI complet — commence par data:image/...;base64,. Le format est alors détecté automatiquement.
• Chaîne brute — uniquement les caractères Base64, sans préfixe. L'outil tente d'identifier le format via la signature des octets.

Étape 2 : Choisir le format (optionnel)

Le sélecteur Format de l'image est réglé sur Auto-détection par défaut. Laissez-le ainsi dans la majorité des cas. Forcez un format précis seulement si votre chaîne brute n'est pas reconnue, par exemple un SVG encodé sans préfixe.

Étape 3 : Décoder et télécharger

Cliquez sur « Décoder l'image ». L'aperçu s'affiche immédiatement, accompagné du format détecté, des dimensions en pixels et du poids du fichier. Le bouton « Télécharger l'image » enregistre le fichier reconstitué avec la bonne extension.

Formats supportés et détection

L'outil reconnaît les principaux formats d'image du web. Lorsqu'aucun préfixe data URI n'est présent, il lit les premiers octets décodés (la « signature » ou magic number) pour deviner le type.

Reconstituer le fichier en JavaScript

En coulisse, décoder une image revient à transformer le Base64 en données binaires, puis en Blob téléchargeable :

// 1. Extraire le type MIME et les données du data URI
const dataUri = 'data:image/png;base64,iVBORw0KGgo...';
const [meta, b64] = dataUri.split(',');
const mime = meta.match(/data:(.*?);base64/)[1];

// 2. Décoder le Base64 en chaîne binaire
const binary = atob(b64);

// 3. Convertir en tableau d'octets (Uint8Array)
const bytes = new Uint8Array(binary.length);
for (let i = 0; i < binary.length; i++) {
  bytes[i] = binary.charCodeAt(i);
}

// 4. Créer un Blob puis une URL téléchargeable
const blob = new Blob([bytes], { type: mime });
const url = URL.createObjectURL(blob);

// 5. Déclencher le téléchargement
const a = document.createElement('a');
a.href = url;
a.download = 'image.png';
a.click();
URL.revokeObjectURL(url);

Cas d'usage réels

1. Extraire une image d'un fichier CSS ou HTML

Vous trouvez une icône embarquée en background-image: url('data:image/...') et vous voulez récupérer le fichier original ? Copiez le data URI, collez-le dans l'outil et téléchargez l'image en un clic.

2. Déboguer une réponse d'API

De nombreuses API renvoient des images en Base64 dans leur JSON (avatars, QR codes, captures, vignettes générées). Décoder la chaîne permet de vérifier visuellement que le serveur renvoie bien le bon contenu :

{
  "user": "marie",
  "avatar": "data:image/jpeg;base64,/9j/4AAQSkZJRg..."
}

Collez la valeur du champ avatar dans l'outil pour confirmer le rendu.

3. Récupérer une image stockée en base de données

Certaines applications stockent les petites images en Base64 directement en base de données (colonne TEXT) ou dans le localStorage. Cet outil reconstitue le fichier pour l'archiver ou le réutiliser ailleurs.

4. Convertir un export d'outil de design

Des éditeurs d'icônes ou de SVG exportent parfois directement en data URI. Le décodeur permet d'obtenir un vrai fichier .svg, .png ou .webp exploitable dans votre projet.

Astuces, erreurs et sécurité

🎯 Bonnes pratiques

• Copiez la chaîne entière — du premier au dernier caractère, y compris les = finaux de padding.
• Conservez le data URI quand c'est possible : la détection du format est alors fiable à 100 %.
• Vérifiez les dimensions affichées après décodage : elles confirment que l'image n'est pas corrompue.
• Renommez le fichier téléchargé selon son usage, l'outil propose un nom générique avec la bonne extension.

⚠️ Erreurs fréquentes

• « Chaîne Base64 invalide » — la chaîne contient des espaces, des retours à la ligne parasites ou des caractères non Base64. Nettoyez-la avant de réessayer.
• Image cassée à l'aperçu — le format sélectionné ne correspond pas au contenu réel. Repassez en Auto-détection.
• Chaîne tronquée — un copier-coller incomplet produit une image partielle. Récupérez la totalité de la chaîne source.
• URL-safe Base64 — certaines API utilisent les caractères - et _ au lieu de + et /. L'outil les normalise automatiquement.

🔒 Confidentialité et sécurité

Tout le traitement est 100 % local : la chaîne Base64 n'est jamais envoyée vers un serveur. Le décodage utilise les API natives du navigateur (atob, Blob, URL.createObjectURL). Vous pouvez donc décoder des images sensibles en toute confiance, même hors ligne.

Conclusion

Le convertisseur Base64 vers Image est l'outil indispensable pour reconstituer un fichier image à partir de données encodées. Qu'il s'agisse de déboguer une API, d'extraire une icône d'une feuille de style ou d'archiver une image stockée en base, le décodage est instantané, gratuit et entièrement privé. Collez votre chaîne, vérifiez l'aperçu, téléchargez : trois clics suffisent.