Utilia

Конвертор на изображение в Base64

Конвертирайте изображение в Base64 или data URI с готов за поставяне CSS и HTML или декодирайте Base64 обратно в изображение с преглед. Безплатно, без качване.

Изображение → Base64

Base64 → изображение

Как да конвертирате изображение в Base64

  1. В Изображение → Base64 пуснете изображение в зоната за плъзгане или щракнете върху нея, за да го изберете (PNG, JPEG, GIF, WebP, SVG, ICO, BMP, AVIF…).
  2. Изберете Изход: Data URI (data:image/png;base64,…), Само Base64, CSS background-image или HTML таг , който съдържа и ширината и височината на изображението.
  3. Щракнете върху Копирай или върху Изтегли като .txt за дълги резултати.

Редът под зоната за плъзгане показва реалния формат (прочетен от байтовете на файла, а не от името му), размерите, размера на файла и дължината на data URI.

Как да конвертирате Base64 обратно в изображение

  1. В Base64 → изображение поставете текста в Base64 текст или data URI. Можете да поставите чист Base64 низ, пълен data URI или дори цяло CSS правило или таг <img>: data URI се намира вътре в него. Нови редове и интервали се пренебрегват, а работи и URL-безопасният Base64 (с - и _).
  2. Щракнете върху Декодирай изображението. Появяват се прегледът, типът, размерите и големината.
  3. Щракнете върху Изтегли изображението, за да го запазите с правилното разширение на файла.

Типът се проверява по „магическите байтове“, сигнатурата в началото на всеки формат на изображение (например 89 50 4E 47 за PNG или FF D8 FF за JPEG). Ако data URI твърди, че е image/jpeg, но съдържа PNG, инструментът ви уведомява и използва реалния тип. Всичко, което не е разпознато изображение, се отхвърля, а ограничението е 20 MB данни на изображението.

Как работи Base64

Base64 превръща всеки 3 байта от файл в 4 печатни символа от A–Z, a–z, 0–9, + и /, с = като допълване накрая. Затова кодираният текст е около 33% по-голям от файла: икона от 30 KB става около 40 KB текст. Data URI добавя кратко заглавие, data:<type>;base64,, за да знае браузърът как да го прочете.

Кога да вграждате изображения като data URI

Data URI са удобни за:

  • малки икони, лога и фонове в CSS, за да се спести една заявка;
  • HTML имейли и еднофайлови HTML документи, които трябва да работят без външни файлове;
  • JSON API и конфигурационни файлове, които могат да носят само текст.

Не са подходящи за големи снимки. Текстът е с една трета по-голям от файла, не може да се кешира отделно от страницата или стиловия файл, който го съдържа, и забавя изобразяването. Над приблизително 10 до 100 KB обикновеният файл на изображението, сервиран с добро кеширане, обикновено е по-добър, затова инструментът показва напомняне за изображения над 100 KB.

Всичко се изпълнява във вашия браузър: изображенията и поставеният текст никога не се качват на сървър.

Често задавани въпроси

Base64 начин за компресиране или защита на изображение ли е?

Не. Base64 прави данните с около 33% по-големи и всеки може да ги декодира. Той само превръща двоични данни в текст, който може да пътува там, където двоичните данни не могат.

Защо data URI не се показва?

Най-честите причини са липсващ или грешен тип в заглавието, интервали или кавички, поставени в средата на низа, или съкратен текст. Поставете го в Base64 → изображение: инструментът съобщава за невалидни символи и проверява реалния тип.

Мога ли да използвам SVG като data URI?

Да. SVG може да се кодира в Base64 като всяко изображение. За SVG data URI с URL кодиране (data:image/svg+xml,%3Csvg…) често е по-кратък; този инструмент декодира и двете форми.

Работи ли с HEIC или AVIF изображения?

Кодирането работи с всеки файл на изображение. Прегледът се появява само ако браузърът ви може да показва формата, но Base64 текстът и изтеглянето винаги са правилни.

Има ли ограничение за размера?

Да, 20 MB данни на изображението, и в двете посоки. По-големите низове забавят браузърите и рядко са добра идея в уеб страница.