Imagine în Base64

Trage aici o imagine sau un SVG ca să obții un Data URI Base64, o regulă de fundal CSS sau cod SVG inline, fiecare cu buton de copiere și previzualizare.

Despre acest instrument

Imagini ca cod pentru HTML și CSS

Transformă o imagine sau un SVG într-un Data URI Base64, o regulă de fundal CSS sau cod SVG inline.

Data URI Base64

Un URI data: pe care îl poți lipi într-un atribut img src, un șablon de e-mail sau un fișier JSON.

Fundal CSS

O regulă background-image gata făcută pentru foi de stil și stiluri inline.

SVG inline

Fișierele SVG îți dau și codul lor, pe care îl lipești direct în HTML, unde îl poți stiliza cu CSS.

Cum se folosește

  1. Trage aici un fișier PNG, JPG, WebP, GIF sau SVG.
  2. Verifică previzualizarea ca să te asiguri că e fișierul potrivit.
  3. Dă clic pe Copiază la Data URI Base64, la Fundal CSS sau, pentru SVG, la SVG inline.
  4. Lipește codul în HTML, CSS sau șablon. Golește pregătește instrumentul pentru următorul fișier.

Întrebări frecvente

Imaginile mele sunt încărcate pe un server?

Nu. Fiecare imagine este citită, procesată și salvată în fila browserului cu Canvas, Web Workers și WebAssembly. Nimic nu este încărcat, stocat sau înregistrat.

Când merită să încorporez o imagine ca Base64?

Pentru iconițe și logo-uri mici economisește o cerere în plus. Pentru fotografii mai mari, un fișier de imagine obișnuit este de regulă mai rapid, pentru că Base64 e cu circa o treime mai mare.

Base64 modifică imaginea?

Nu. Data URI-ul conține fișierul original octet cu octet, în formatul lui, doar scris ca text. Micșorează mai întâi imaginile mari cu Comprimă imagini.

Pot folosi un Data URI într-un e-mail?

Adesea nu: multe programe de e-mail, inclusiv Gmail, blochează imaginile scrise ca Data URI. Pentru newslettere, o imagine găzduită pe un server e mai sigură. În paginile HTML, CSS și JSON, Data URI-urile funcționează bine.

Este gratuit și pune filigran?

Da, se folosește gratuit, fără cont, iar Toolula nu adaugă niciodată filigran. Planul gratuit are limite de utilizare rezonabilă; Toolula Pro, un plan opțional, le crește.