Что такое Кодировщик изображений в Base64?

Image to Base64 Encoder конвертирует файлы изображений (PNG, JPEG, GIF, SVG, WebP) в текстовые строки в кодировке Base64. Встраивайте изображения прямо в HTML, CSS или JSON без размещения отдельных файлов — меньше HTTP-запросов и проще разметка.

Кодировщик читает байты изображения на вашем устройстве и выдаёт восемь результатов: чистый Base64, data URI для атрибутов src=, полный тег <img>, объявление CSS background-image, ссылку HTML-фавиконки, XML-обёртку, фрагмент JavaScript с Image и объект JSON с именем файла, типом MIME, размером и data URI. Включите Оптимизацию, чтобы уменьшить длинную сторону и сначала перекодировать в JPEG или WebP — это может сократить строку вдвое перед встраиванием. Перетащите или вставьте несколько изображений сразу — у каждого будет свой подписанный результат. Нужно наоборот? Раздел «Декодировать Base64 обратно в изображение» превращает любую строку в видимую и скачиваемую картинку. Поддерживаемые форматы: PNG, JPEG, GIF, SVG, WebP, BMP, ICO, AVIF и HEIC до 20 МБ каждый.

Как использовать

1. Шаг 1 — Загрузите изображение, перетащив его, нажав на область загрузки или вставив через Ctrl+V. Чтобы сначала уменьшить, откройте Параметры кодирования и задайте максимальный размер или качество.
2. Шаг 2 — Выберите формат вывода: чистый Base64, data URI, тег img, CSS background-image, ссылку HTML-фавиконки, XML, фрагмент JavaScript с Image или объект JSON для передачи в API.
3. Шаг 3 — Скопируйте результат в буфер обмена или скачайте как текстовый файл.

Когда использовать

• Встроить маленький логотип или иконку в HTML-письмо, чтобы он показывался без внешнего хостинга.
• Встроить небольшой SVG-спрайт прямо в таблицу стилей и убрать один блокирующий HTTP-запрос.
• Передать картинку внутри JSON-полезной нагрузки, поля JWT или YAML-конфига, когда URL запрещены.

Результат

У вас есть логотип размером 2 КБ, который нужно встроить прямо в шаблон письма. Загрузите PNG-файл, скопируйте вывод data URI и вставьте его в атрибут src тега img в HTML — без внешнего хостинга.

Частые вопросы

Увеличит ли Base64 размер моего файла?

Да, примерно на 33%. Base64 кодирует три байта четырьмя ASCII-символами, поэтому PNG в 30 КБ превратится в текст около 40 КБ. Имеет смысл только для файлов меньше 5 КБ, где экономия HTTP-запроса перевешивает прибавку.

Когда лучше встраивать изображение в Base64, а когда оставить ссылку?

Встраивайте всё, что меньше 4–5 КБ, видно на первом экране и плохо кэшируется (аватары, одноразовые иконки). Оставляйте ссылкой то, что переиспользуется на нескольких страницах, чтобы при повторе работал кеш браузера.

Почему мой data URI начинается с data:image/png;base64,?

Это медиа-тип. data:image/png говорит браузеру, что дальше идут байты PNG, base64 указывает на кодировку, запятая отделяет заголовок от содержимого. Без этого декодер не знает, какой это формат.

Можно ли расшифровать Base64 обратно в видимое изображение?

Да. Откройте на этой странице раздел «Декодировать Base64 обратно в изображение», вставьте data URI или чистый Base64 — картинка отобразится, и её можно скачать. URL-безопасный Base64 (вариант с - и _) тоже подходит.

Стоит ли кодировать SVG в Base64?

Обычно нет. SVG сам по себе текст, поэтому URL-кодирование внутри data URI занимает меньше места, чем Base64. Инструмент поддерживает SVG для случаев, когда нужна одна цельная строка для передачи.

Похожие инструменты