Obrázek na Base64
Převeď jakýkoli obrázek na Base64 data URI připravené na inline použití v HTML, CSS nebo Markdown. Soubory zůstávají v prohlížeči.
No image yet.
Zadej vstup nahoře, aby ses dostal k výsledku.
Vytvořil JXXR1 · ♥ Sponzorovat · ☕ Kup mi kávu
K čemu to slouží?
Promění obrázek na Base64 data URI — řetězec, který můžeš inline vložit do HTML <img src="data:image/png;base64,...">, CSS background-image: url(data:...) nebo Markdown. Soubor se konvertuje v tvém prohlížeči a nikam se neuploaduje.
Kdy to použít
- Inline SVG/PNG ikona, která jde do CSS a chceš se vyhnout dodatečnému HTTP requestu.
- Připojení obrázku do e-mailové šablony, která nemůže linkovat externí zdroje.
- Příprava data URI pro Markdown dokument, který se distribuuje samostatně.
- Demo / prototyp bez backendu na hosting souborů.
Časté chyby
- Base64 zvětší soubor o ~33 %. Pro velké obrázky to nemusí být výhra.
- Nemůže se cache-ovat samostatně. Inline obrázek se znovu stáhne s každou stránkou.
- Velké data URI v HTML zvyšují parse time. Pro obrázky > 1–2 KB raději externí soubor.
- SVG netřeba base64. Inline SVG jako
<svg>element je menší a flexibilnější. - MIME type. Ujisti se, že
image/jpegvs.image/pngsedí se skutečným formátem souboru.