Narzędzie Obraz ↔ Base64 konwertuje pliki obrazów (PNG, JPG, SVG, WebP, GIF) na zakodowane w Base64 ciągi Data URI i z powrotem. Przeciągnij, wklej lub kliknij, aby załadować obraz; skopiuj pełny ciąg data:image/...;base64,..., aby osadzić go bezpośrednio w CSS, HTML lub konfiguracji. Możesz też wkleić Data URI, aby wyświetlić podgląd i pobrać go jako plik obrazu.
Obrazy zakodowane w Base64 mogą być osadzane bezpośrednio w plikach CSS, HTML lub plikach konfiguracyjnych — jest to przydatne w przypadku małych ikon, szablonów e-mail lub artefaktów budowania, gdzie zewnętrzne żądania o obrazy są niepożądane. To narzędzie sprawia, że konwersja jest bezwysiłkowa. Przeciągnij plik obrazu, wklej go ze schowka lub kliknij, aby przeglądać pliki. Narzędzie skonwertuje go na Data URI z poprawnym typem MIME (data:image/png;base64,..., data:image/svg+xml;base64,... itd.). Kierunek przeciwny również działa — wklej Data URI, a narzędzie wyrenderuje obraz do podglądu i zaoferuje link do pobrania, aby zapisać go jako rzeczywisty plik. Działa całkowicie w przeglądarce, bez przesyłania danych na serwer — Twoje obrazy nigdy nie opuszczają Twojego urządzenia. Obsługuje formaty PNG, JPG/JPEG, SVG, WebP, GIF oraz ICO.
Wiele sposobów na załadowanie obrazu: przeciągnij plik z systemu operacyjnego, wklej ze schowka (działają zrzuty ekranu) lub kliknij, aby otworzyć okno wyboru pliku.
Gdy wkleisz Data URI, narzędzie natychmiast renderuje obraz, dzięki czemu możesz go zweryfikować przed skopiowaniem lub pobraniem.
Kopiuje kompletny ciąg data:image/...;base64,... gotowy do wklejenia do CSS, atrybutu src w HTML lub konfiguracji JSON.
Brak oczekiwania na przesłanie — wszystko dzieje się lokalnie. Nawet duże obrazy są konwertowane w ułamku sekundy.
Z Data URI Base64 zapisz zdekodowany obraz jako rzeczywisty plik (PNG, JPG, SVG itp.) z poprawnym rozszerzeniem.
Wspiera PNG, JPG, SVG, WebP, GIF i ICO. Typ MIME jest wykrywany automatycznie, więc Twoje Data URI jest zawsze poprawne.
Skonwertuj ikonę 16×16 na Base64 i osadź ją bezpośrednio w background-image: url(...). Brak żądania HTTP, brak problemów z pamięcią podręczną — ikona jest dostarczana wraz z Twoim CSS.
Osadzaj obrazy bezpośrednio w e-mailach HTML jako Data URI, gdy zewnętrzne odniesienia do obrazów są blokowane przez klientów poczty lub oznaczane jako spam.
Dołączaj małe obrazy do paczek (bundle) webpack/vite, aby wyeliminować dodatkowe zapytania o zasoby podczas uruchamiania aplikacji.
Wklej Data URI z narzędzi deweloperskich, źródła HTML lub pliku CSS, aby podejrzeć i pobrać bazowy obraz jako plik.
Gdy osadzony obraz się nie renderuje, wklej Data URI do dekodera, aby sprawdzić, czy Base64 jest poprawny, a typ MIME właściwy.
Kliknij ikonę Image Base64 w panelu DevSuite Pro. Otworzy się dwupanelowy edytor z obszarem upuszczania i polem Data URI.
Przeciągnij plik do obszaru upuszczania, wklej obraz ze schowka (Ctrl+V) lub kliknij obszar, aby przeglądać pliki. Pojawi się podgląd.
Data URI Base64 jest generowane natychmiast w polu wyjściowym — kliknij Kopiuj, aby przesłać je do schowka, gotowe do osadzenia w kodzie.
Aby zamienić Base64 na obraz, wklej Data URI do pola. Podgląd wyrenderuje obraz i pojawi się przycisk Pobierz.
Zapisz zrekonstruowany obraz jako rzeczywisty plik lub skopiuj Data URI, aby udostępnić je lub osadzić w innym miejscu.
Zainstaluj DevSuite Pro za darmo i odblokuj ponad 64 narzędzi programistycznych dla swojej przeglądarki.
