> кодировать | встраивать | оптимизировать <
// Конвертируйте изображения в Base64 строки для веб-разработки и встраивания данных
Перетащите изображение сюда или кликните для выбора
Кликните для обзора файлов
Локальная Обработка
100% клиентская кодировка изображений. Ваши файлы никогда не покидают ваш браузер.
Drag & Drop
Быстрая загрузка с интерфейсом перетаскивания. Мгновенная конвертация в Base64.
Без Ограничений
Кодируйте изображения любого размера или формата. Не требуется регистрация или API ключи.
// FAQ
В: Что такое кодирование изображений в Base64?
О: Кодирование изображений в Base64 конвертирует бинарные данные изображения в текстовую строку используя кодировку Base64. Необходимо для встраивания изображений напрямую в HTML, CSS, email или API без отдельных файлов.
В: Насколько безопасна конвертация изображения в Base64?
О: 100% безопасная локальная обработка. Вся кодировка изображений происходит в вашем браузере. Нулевая загрузка на сервер. Ваши изображения никогда не покидают ваше устройство.
В: Какие форматы изображений поддерживаются?
О: Поддерживает все популярные веб-форматы изображений: PNG, JPEG, GIF, WebP, SVG, BMP и другие. Сохраняет оригинальное качество изображения и формат.
В: Как использовать Base64 изображения в HTML?
О: Используйте формат data URI: <img src="data:image/png;base64,ВАША_BASE64_СТРОКА">. Идеально для встроенных изображений, иконок или уменьшения HTTP-запросов.
В: Есть ли ограничения по размеру файлов?
О: Никаких серверных ограничений. Обработка происходит локально в вашем браузере. Большие файлы могут занять больше времени для кодировки, но будут работать.
// Популярные форматы изображений и MIME-типы
| Формат | MIME-тип |
|---|---|
| PNG | image/png |
| JPEG | image/jpeg |
| GIF | image/gif |
| WebP | image/webp |
| AVIF | image/avif |
| SVG | image/svg+xml |
// Data URI в коде
HTML <img src="data:image/png;base64,iVBORw0KGgo..." alt="">
CSS background: url("data:image/svg+xml;base64,PHN2Zy...");
Linux base64 -w0 logo.png
macOS base64 -i logo.png
Python base64.b64encode(open('logo.png','rb').read()).decode()
Node.js fs.readFileSync('logo.png').toString('base64')
>> Другие вопросы
В: Почему изображение в Base64 примерно на 33 % больше?
О: Base64 кодирует 3 байта в 4 символа, то есть добавляет около трети объёма, который gzip компенсирует лишь частично. Поэтому встраивать изображения имеет смысл только для очень маленьких файлов (несколько КБ).
В: Какой недостаток у data URI по сравнению с файлами изображений?
О: Встроенное изображение нельзя кэшировать отдельно, оно увеличивает HTML или CSS и передаётся заново при каждой загрузке этого файла. Для крупных изображений лучше отдельный файл.
В: Стоит ли встраивать SVG в Base64?
О: Обычно нет: SVG — это текст. data:image/svg+xml,… с URL-кодированием часто меньше Base64 и остаётся читаемым. Но Base64 работает везде.