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

Перетащите изображение в область выше, нажмите для выбора файла, вставьте из буфера обмена или загрузите по URL. Инструмент мгновенно преобразует изображение в строку Base64 и отобразит готовый data URI, который можно скопировать в формате CSS, HTML или Markdown. Всё происходит в браузере — изображение никогда не загружается на сервер, что делает инструмент безопасным для личных и конфиденциальных файлов.

Перейдите на вкладку Base64 → Изображение и вставьте data URI (data:image/png;base64,…) или чистую строку Base64. Инструмент декодирует её, покажет предпросмотр изображения и позволит скачать файл. Формат определяется автоматически: PNG, JPG, SVG, WebP и GIF — всё работает. Полное декодирование происходит локально в браузере — никаких запросов к серверу, ваша строка Base64 никуда не передаётся.

Используйте data URI Base64 в качестве атрибута src тега img: вставьте закодированную строку в src="data:image/png;base64,…". Нажмите «Копировать <img>» выше, чтобы получить готовый тег изображения — без отдельного файлового запроса. Это удобно для email-рассылок, одностраничных документов и встроенных иконок: устраняется лишний HTTP-запрос, и изображение доступно даже без исходного файла.

Укажите data URI внутри url() — например background-image: url("data:image/png;base64,…"). Нажмите «Копировать CSS» выше, чтобы получить готовое правило background-image. Встраивание небольших фонов и иконок таким способом устраняет HTTP-запрос и широко применяется для иконок дизайн-системы, спиннеров загрузки и декоративных элементов, которые редко меняются. Это также делает одностраничные HTML-демонстрации полностью автономными.

В браузере используйте FileReader API: const reader = new FileReader(); reader.onload = () => console.log(reader.result); reader.readAsDataURL(file). В reader.result будет полный URI data:image/...;base64. В React или Next.js вызывайте это внутри useEffect или обработчика onChange на элементе input. Именно такой подход — полностью на стороне клиента — использует этот конвертер. Вы можете применять вывод здесь для быстрой проверки собственной реализации на JavaScript без запуска локального сервера.

Откройте файл в двоичном режиме и закодируйте его: import base64; data = base64.b64encode(open('image.png', 'rb').read()).decode(); uri = f'data:image/png;base64,{data}'. С PIL/Pillow можно сначала сохранить изображение в буфер BytesIO, а затем закодировать байты буфера в Base64. Используйте этот онлайн-инструмент для проверки того, что вывод Python соответствует ожидаемому, прежде чем встраивать его в продакшн-код.

Data URI встраивает байты изображения прямо в HTML, CSS, JSON или email в виде текста — изображение загружается вместе с документом, а не как отдельный HTTP-запрос. Это идеально для маленьких иконок, логотипов в HTML-письмах, одностраничных демонстраций и хранения небольших изображений в базах данных или конфигурационных файлах. Разработчики также используют его для обхода ограничений CORS при работе с canvas на той же странице. Фавиконы часто встраиваются как data URI в секции head HTML, чтобы исключить лишний сетевой запрос при первой загрузке.

Как правило, нет. Кодирование Base64 увеличивает размер данных примерно на 33% по сравнению с исходным двоичным файлом, а встроенные изображения не могут кэшироваться браузером отдельно и не поддерживают ленивую загрузку с атрибутом loading="lazy". Используйте Base64 только для небольших, редко меняющихся ресурсов: фавиконы, маленькие логотипы или спрайты иконок размером до ~10 КБ. Для крупных фотографий, главных изображений или ресурсов, используемых на многих страницах, оставляйте обычные файлы с правильными заголовками HTTP-кэширования.

Да, абсолютно безопасно. Кодирование и декодирование выполняются полностью в вашем браузере с использованием API FileReader и Canvas — ваши изображения никогда не покидают устройство и ничего не передаётся на сервер. Это важное преимущество в плане конфиденциальности по сравнению с такими инструментами, как <strong>base64.guru</strong> и <strong>base64encoder.io</strong>, которые загружают ваши изображения на свои серверы для обработки. На UtiloKit конфиденциальные, корпоративные или неопубликованные изображения остаются на вашем устройстве на протяжении всей конвертации. Можно даже отключиться от интернета после загрузки страницы — инструмент продолжит работать.

Для кодирования подходит любой формат, который браузер умеет читать: PNG, JPEG/JPG, SVG, WebP, GIF, AVIF, BMP и ICO. Декодирование поддерживает все стандартные MIME-типы data:image/* и показывает предпросмотр перед скачиванием. SVG-файлы обрабатываются особым образом — их Base64 можно также встроить в CSS без кодирования с помощью url('data:image/svg+xml,…') с URL-кодированием, однако Base64 является более универсальным способом и работает во всех браузерах и почтовых клиентах.

Да. Используйте кнопку «Копировать Markdown» для синтаксиса  или «Копировать <img>» для HTML-письма. Обратите внимание: некоторые почтовые клиенты (в частности, Outlook и мобильное приложение Gmail) могут скрывать или блокировать Base64-изображения — обязательно проверьте перед массовой рассылкой. Для рекламных кампаний надёжнее размещать изображения на CDN и давать на них ссылки. Для персональных транзакционных писем Base64 стабильно работает в большинстве клиентов.

Base64.guru и base64encoder.io обрабатывают ваши изображения на стороне сервера — файлы загружаются на их инфраструктуру. Конвертер UtiloKit работает на 100% в вашем браузере: без загрузки, без сервера, без хранения данных. UtiloKit также предоставляет готовые фрагменты CSS, HTML и Markdown, поддерживает двунаправленную конвертацию (кодирование и декодирование) и работает офлайн после загрузки страницы. Инструмент полностью бесплатен — без ограничений по размеру файла и количеству конвертаций.

Абсолютно бесплатный: без регистрации, без водяных знаков, без ограничений по размеру файла или количеству изображений. В отличие от browserling.com, который ограничивает бесплатные конвертации и требует платного тарифа для файлов выше определённого размера, UtiloKit не имеет никаких ограничений. Поскольку инструмент работает на стороне клиента, нет никаких расходов за изображение или трафик — конвертируйте столько изображений, сколько угодно, размером до предела оперативной памяти браузера.

Да. Инструмент полностью адаптирован под мобильные устройства и работает в любом мобильном браузере, включая Safari на iPhone и Chrome на Android. Можно выбрать изображения из фотогалереи или приложения «Файлы», или вставить URL для загрузки удалённого изображения. Результат копируется в буфер обмена — вы можете вставить его прямо в Notion, редактор кода или другое приложение. Установка приложения не нужна — просто откройте страницу в мобильном браузере, и она работает точно так же, как десктопная версия.