Какие типы изображений работают?

Обычные читаемые браузером форматы: PNG, JPG, WebP, GIF и т.д.

Почему строка длиннее файла?

Кодирование Base64 увеличивает размер — это нормально, не ошибка.

Можно пачкой всю папку?

Здесь по одному изображению, чтобы проверить превью.

Подходит ли для больших фото?

Нет — крупные изображения отдавайте обычными URL; Base64 оставьте для мелких ассетов.

Изображение в Base64 — data URL онлайн

Превратите изображение в текст Base64 или полный data URL `data:image/...;base64,` для HTML, CSS, Markdown или конфигов, где принимают только строки. Лучше для крошечных иконок и превью — встраивание многомегабайтного фото раздувает страницу и бьёт по загрузке.

Перетащите файл сюда или нажмите, чтобы выбрать

Включить префикс data: URL

Base64 представляет двоичные данные читаемыми символами. Data URL позволяет браузеру загрузить картинку без отдельного HTTP-запроса — но строка примерно на треть больше файла и плохо кэшируется.

Используйте для иконок масштаба килобайт, пиксель-арта, маленьких логотипов. Пихать отпускное фото в CSS раздувает стили.

Сначала сожмите или измените размер, если исходник велик — закодированная строка тоже уменьшится.

Как конвертировать

Выберите изображение и подтвердите превью
При необходимости переключите префикс data URL
Скопируйте текст вывода
Вставьте в HTML, CSS или конфиг

Когда Base64 для изображений имеет смысл

Однофайловые демо или HTML писем с inline-иконкой.
Крошечный CSS-фон без отдельного ассета.
API или конфиги, где для картинок только текстовые поля.
Опциональный префикс data URL для копирования напрямую.

Сценарии

Иконка 16×16 в документации компонента
Маленький бейдж в шаблоне письма (следите за общим размером)
Поле формы, ожидающее данные изображения Base64

Советы

Для CSS `url()` включите префикс data URL.
Выключите префикс, когда получатель хочет только сырой Base64.
Строка слишком длинная? Сначала сожмите или измените размер.
Нужен файл обратно? Base64 → изображение.

Формы вывода

Ввод	Вывод	Примечание
Маленькая PNG-иконка	data:image/png;base64,...	С префиксом
То же изображение	Сырая строка Base64	Без префикса

Частые вопросы об Image→Base64

Какие типы изображений работают?: Обычные читаемые браузером форматы: PNG, JPG, WebP, GIF и т.д.
Почему строка длиннее файла?: Кодирование Base64 увеличивает размер — это нормально, не ошибка.
Можно пачкой всю папку?: Здесь по одному изображению, чтобы проверить превью.
Подходит ли для больших фото?: Нет — крупные изображения отдавайте обычными URL; Base64 оставьте для мелких ассетов.