← Povratak na značajke
Free

Slika ↔ Base64

Image ↔ Base64 pretvara slikovne datoteke (PNG, JPG, SVG, WebP, GIF) u Base64-kodirane data URI-je i natrag. Povucite, zalijepite ili kliknite za učitavanje slike; kopirajte cijeli niz data:image/...;base64,... za ugradnju u CSS, HTML ili konfiguraciju. Ili zalijepite data URI za pregled i preuzimanje slike kao datoteke.

Slike kodirane u Base64 mogu se izravno ugraditi u CSS, HTML ili konfiguracijske datoteke — korisno za male ikone, e-mail predloške ili build artefakte gdje vanjski zahtjevi za slikama nisu poželjni. Ovaj alat pretvorbu čini jednostavnom. Povucite slikovnu datoteku, zalijepite iz međuspremnika ili kliknite za pregled datoteka. Alat je pretvara u data URI s ispravnim MIME tipom (data:image/png;base64,..., data:image/svg+xml;base64,..., itd.). Radi i suprotan smjer — zalijepite data URI i alat prikazuje sliku za pregled te nudi poveznicu za preuzimanje kao prave datoteke. Sve se odvija unutar preglednika, bez uploada — vaše slike nikad ne napuštaju vaše računalo. Podržava PNG, JPG/JPEG, SVG, WebP, GIF i ICO formate.

Pregled uživo
example.com
Image ↔ Base64 Slika → Base64 Base64 → Slika
Ispusti sliku
Ispusti, zalijepi ili klikni
PNG, JPG, SVG, WebP
logo.png
8.4 KB · 256×256
Data URI od Base64
data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAQAAAAEACAYAAABccqhmAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAADJJREFUeNrs0rERwCAIhFEwjv9/6OS...
Kopiraj Preuzmi
Ključne značajke

Povucite, zalijepite ili pregledajte

Više načina za učitavanje slike: povucite datoteku s operativnog sustava, zalijepite iz međuspremnika (snimke zaslona rade), ili kliknite za otvaranje odabira datoteke.

Pregled slike uživo

Kada zalijepite data URI, alat odmah prikazuje sliku kako biste je mogli provjeriti prije kopiranja ili preuzimanja.

Kopiranje Data URI-ja jednim klikom

Kopira cijeli niz data:image/...;base64,... spreman za lijepljenje u vaš CSS, HTML src atribut ili JSON konfiguraciju.

Trenutna pretvorba

Bez čekanja na upload — sve se odvija lokalno. Čak se i velike slike pretvaraju u djeliću sekunde.

Preuzimanje kao datoteka

Iz Base64 data URI-ja spremite dekodiranu sliku kao pravu datoteku (PNG, JPG, SVG, itd.) s ispravnom ekstenzijom.

Podržava sve uobičajene formate

Podržava PNG, JPG, SVG, WebP, GIF i ICO. MIME tip se prepoznaje automatski pa je vaš data URI uvijek ispravan.

Uobičajeni primjeri upotrebe

Ugradnja malih ikona u CSS

Pretvorite ikonu 16×16 u Base64 i ugradite je izravno u background-image: url(...). Bez HTTP zahtjeva, bez promašaja u predmemoriji — ikona putuje zajedno s vašim CSS-om.

E-mail predlošci

Ugradite slike izravno u HTML e-mailove kao data URI-je kada klijenti blokiraju vanjske reference na slike ili ih označavaju kao spam.

Build artefakti i skupovi datoteka

Uključite male slike u izlaz webpack/vite bundlea kako biste izbjegli dodatne zahtjeve za resurse pri pokretanju aplikacije.

Izdvajanje slika iz Data URI-ja

Zalijepite data URI iz dev alata, HTML izvornog koda ili CSS datoteke za pregled i preuzimanje pripadajuće slike kao datoteke.

Otklanjanje grešaka kod ugrađenih slika

Kada se ugrađena slika ne prikazuje, zalijepite data URI u dekoder da provjerite je li Base64 valjan i je li MIME tip ispravan.

Kako koristiti
1

Otvorite Image ↔ Base64

Kliknite ikonu Image Base64 u DevSuite Pro doku. Otvara se panel s dva okna — zonom za ispuštanje datoteke i poljem za data URI.

2

Učitajte sliku

Povucite datoteku u zonu za ispuštanje, zalijepite sliku iz međuspremnika (Ctrl+V) ili kliknite zonu za pregled datoteka. Prikazuje se pregled.

3

Preuzmite Data URI

Base64 data URI odmah se generira u izlaznom polju — kliknite Copy za slanje u međuspremnik, spremno za lijepljenje.

4

Obrnuti smjer

Za pretvorbu Base64 → slika, zalijepite data URI u polje. Pregled prikazuje sliku i pojavljuje se gumb za preuzimanje.

5

Preuzmite ili kopirajte

Spremite rekonstruiranu sliku kao pravu datoteku, ili kopirajte data URI za dijeljenje ili ugradnju negdje drugdje.

Spremni za isprobavanje?

Instalirajte DevSuite Pro besplatno i otključajte 64+ razvojnih alata za svoj preglednik.

Dodaj u Chrome Dodaj u Edge Dodaj u FireFox