Skip to content

Immagine a Base64 (e ritorno)

Codifica qualsiasi immagine a un URI di dati, o incolla un URI e visualizza l'immagine.

Gli URI di dati Base64 ti permettono di incorporare un'immagine inline in HTML, CSS o JSON senza un file separato. Utile per piccole icone SVG, firme email inline, payload JWT che includono un avatar, o ovunque una richiesta di rete sarebbe più problematica di quello che vale. Lo strumento qui sotto codifica o decodifica immagini interamente nel tuo browser usando le API standard FileReader e atob/btoa.

Everything happens locally — the FileReader API runs entirely in your browser. No upload, no analytics on the file contents.

How to use

  1. Scegli una direzione

    "Immagine → Base64" codifica un file che trascini. "Base64 → Immagine" decodifica un URI di dati che incolla.

  2. Trascina o incolla

    Trascina un file sulla zona di rilascio (codifica), o incolla l'URI di dati nel textarea (decodifica). I file fino a 8 MB sono accettati.

  3. Copia o salva il risultato

    L'output codificato è un URI di dati completo pronto per essere rilasciato in <img src="…">, CSS background-image: url(…), o JSON. L'anteprima decodificata viene visualizzata sotto il campo di incolla.

Frequently asked questions

L'immagine viene caricata da qualche parte?
No. La conversione avviene nel tuo browser tramite l'API FileReader — i byte non lasciano mai la pagina. Non c'è nemmeno un evento di analytics che includa i contenuti del file.
Perché l'URI di dati è più grande del file?
La codifica Base64 gonfia i dati binari di circa il 33% (ogni 3 byte diventano 4 caratteri). Per un'immagine da 100 KB, aspettati ~133 KB di testo. Questo è il costo dell'incorporamento di dati binari in un contenitore di testo.
Quando dovrei incorporare un'immagine invece di collegarla?
Quando l'immagine è piccola (< 10 KB), usata una volta, e una richiesta HTTP separata rallenterebbe il rendering critico. Esempi: SVG della sezione hero, loghi email inline, avatar incorporati in JWT. Oltre a ~10 KB, un file separato è solitamente più veloce nel complesso perché può essere memorizzato nella cache separatamente.
Qual è il tipo MIME per SVG?
`image/svg+xml`. Il codificatore lo legge dall'attributo `type` del file, che il browser imposta correttamente per i formati di immagine standard.
Posso codificare file non-immagine?
Questo widget è solo immagini per progettazione (e convalida il prefisso dell'URI di dati al decodaggio). Per arbitrario binario → Base64 vedi /it/code/base64/, che gestisce il testo UTF-8 direttamente.

About

Cos'è un URI di dati?

Uno schema URI definito in RFC 2397 che incorpora la risorsa inline. `data:image/png;base64,iVBORw0KGgo...` dichiara il tipo MIME, dice che il payload è codificato in Base64, e include i byte dopo la virgola. I browser e la maggior parte dei parser lo accettano ovunque un URL http(s) sarebbe previsto nei contesti di immagine.

Velocità di codifica

Il `readAsDataURL` di FileReader è asincrono e utilizza l'implementazione nativa di Base64 del browser. Aspettati meno di 100 ms anche per file di diversi MB; il collo di bottiglia è la lettura del file dal disco, non la codifica stessa.

Sources & references

Authoritative references behind the math, constants, and tables on this page. Verified by Buğra Sözeri on the dates shown and re-checked at every deploy.