Darmowe narzędzie dla deweloperów
Konwerter Obraz ↔ Base64 Online
Zakoduj obraz (JPG, PNG, WebP, SVG, GIF) jako Base64 / Data URL lub zdekoduj Base64 z powrotem na plik. Lokalnie w przeglądarce — szybko, prywatnie, bez limitu.
Krótka odpowiedź
W trybie Obraz → Base64 wgraj plik i skopiuj gotowy Data URL do CSS, HTML lub e-maila. W trybie Base64 → Obraz wklej ciąg znaków i zobacz podgląd + pobierz plik. Wszystko działa lokalnie w Twojej przeglądarce.
Kliknij lub przeciągnij obraz JPG / PNG / WebP / SVG / GIF
Kodowanie lokalnie w przeglądarce, bez uploadu na serwer
Przykład użycia w CSS
.icon-close {
width: 16px; height: 16px;
background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0i...);
background-size: contain;
}Przykład użycia w HTML
<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAA..." alt="Logo" />
Kiedy NIE używać Base64 dla obrazów?
Dla zdjęć produktowych, fotografii i grafik > 10 KB. Base64 jest ~33% większy od binarki, nie korzysta z cache przeglądarki (za każdym razem przesyłany z HTML) i blokuje renderowanie strony do czasu sparsowania dokumentu. Dla dużych obrazów używaj zwykłych plików z lazy loadingiem.
Często zadawane pytania
Co to jest Base64 i Data URL?▾
Base64 to sposób zapisania binarnych danych (np. obrazu) jako ciągu znaków tekstowych. Data URL to pełny format z prefiksem 'data:image/png;base64,...' który możesz wkleić bezpośrednio do HTML, CSS albo JSON i przeglądarka wyświetli obraz bez pobierania osobnego pliku.
Kiedy używać Base64 do obrazów w kodzie?▾
Najczęstsze przypadki: (1) małe ikony w CSS (background-image) żeby uniknąć dodatkowego żądania HTTP, (2) inlining obrazów w e-mailach HTML żeby działały bez załączników, (3) tymczasowe przechowywanie zdjęć w localStorage / JSON, (4) osadzanie w dokumentach PDF / SVG.
Czy Base64 spowalnia stronę?▾
Dla obrazów < 4 KB Base64 w CSS może przyspieszyć stronę (mniej żądań HTTP). Dla większych plików efekt jest odwrotny — Base64 jest ~33% większy od binarki, a HTML/CSS z dużymi Data URL zwiększa czas parsowania. Jako reguła kciuka: używaj dla ikon, nie używaj dla zdjęć > 10 KB.
Czy narzędzie wysyła mój obraz na serwer?▾
Nie. Całe kodowanie i dekodowanie Base64 dzieje się lokalnie w Twojej przeglądarce (FileReader API + atob/btoa). Plik nigdy nie trafia na żaden serwer zewnętrzny — to ważne, jeśli obraz zawiera wrażliwe dane firmowe.
Jak odczytać Base64 z kodu innego projektu?▾
Wklej wartość w pole dekodowania. Akceptujemy zarówno pełne Data URL ('data:image/png;base64,...') jak i surowy Base64 (bez prefiksu — wtedy domyślnie traktujemy jako PNG). Narzędzie wyświetli podgląd i pozwoli pobrać jako plik z rozpoznanym rozszerzeniem.
Czy mogę zakodować SVG do Base64?▾
Tak, SVG działa jak każdy inny obraz. Popularne zastosowanie: osadzanie ikon SVG w arkuszach CSS przez 'background-image: url(data:image/svg+xml;base64,...)'. Dla SVG często prostsze jest użycie niezakodowanego Data URL (data:image/svg+xml;utf8,<svg>...</svg>), który jest mniejszy od Base64.
Jaki jest maksymalny rozmiar Base64 w Data URL?▾
Chrome i Firefox akceptują Data URL do ~2 MB bez problemu. W Edge i Safari limit jest bardziej rygorystyczny (~500 KB dla CSS). IE miał limit 32 KB. Dla produkcyjnych projektów nie rekomendujemy Data URL powyżej 100 KB.
Inne darmowe narzędzia
Zmniejsz rozmiar pliku bez utraty jakości
Zmniejsz zdjęcie do 2MB, 1MB, 500KB
Usuń tło ze zdjęcia za darmo z AI
Wygeneruj kod QR z tekstu lub linku
Konwertuj między JPG, PNG, WebP i AVIF
Zamień zdjęcia z iPhone'a na JPG
Skaluj obrazy do wybranych wymiarów
Wyodrębnij dominujące kolory z obrazu
Podgląd tekstu w 20+ fontach z polskimi znakami
Obróć lub odbij zdjęcie lustrzanie
Nałóż napis, watermark lub podpis na obraz
Watermark tekstowy z kontrolą pozycji i przezroczystości
Przelicz wymiary zachowując aspect ratio
Wyczyść GPS, datę i metadane z JPG/PNG
OCR polski + angielski w przeglądarce, zamień obraz na tekst
Generator AI
Wygeneruj swój obraz z AI
Opisz co chcesz zobaczyć — AI stworzy obraz w kilka sekund. Po Google loginie odblokujesz 1 darmowy obraz startowy.