Изображение <-> Base64 преобразует файлы изображений (PNG, JPG, SVG, WebP, GIF) в Base64-кодированные Data URI и обратно. Перетащите, вставьте или нажмите, чтобы загрузить изображение; скопируйте полную строку data:image/...;base64,... для встраивания встроенно в CSS, HTML или конфиг. Или вставьте Data URI для предпросмотра и загрузки как файл изображения.
Base64-кодированные изображения можно встраивать непосредственно в CSS, HTML или файлы конфигурации - полезно для небольших значков, шаблонов электронной почты или артефактов сборки, где нежелательны запросы внешних изображений. Этот инструмент делает преобразование простым. Перетащите файл изображения, вставьте из буфера обмена или нажмите для просмотра. Инструмент преобразует его в Data URI с правильным типом MIME (data:image/png;base64,..., data:image/svg+xml;base64,..., и т.д.). Обратное направление также работает - вставьте Data URI и инструмент отобразит изображение для предпросмотра и предложит ссылку для загрузки, чтобы сохранить его как реальный файл. Работает полностью в браузере, без загрузок - ваши изображения никогда не покидают ваш компьютер. Обрабатывает форматы PNG, JPG/JPEG, SVG, WebP, GIF и ICO.
Несколько способов загрузить изображение: перетащить файл из вашей ОС, вставить из буфера обмена (работают скриншоты) или нажать для открытия средства выбора файлов.
Когда вы вставляете Data URI, инструмент сразу отображает изображение, чтобы вы могли проверить его перед копированием или загрузкой.
Копирует полную строку data:image/...;base64,... готовую вставить в ваш CSS, атрибут src HTML или конфиг JSON.
Без ожидания загрузки - все происходит локально. Даже большие изображения преобразуются за долю секунды.
Из Data URI Base64 сохраните декодированное изображение как реальный файл (PNG, JPG, SVG и т.д.) с правильным расширением.
Поддерживает PNG, JPG, SVG, WebP, GIF и ICO. Тип MIME определяется автоматически, поэтому ваш Data URI всегда правильный.
Преобразуйте значок 16x16 в Base64 и встроите его в background-image: url(...). Без HTTP запроса, без промаха кеша - значок отправляется с вашим CSS.
Встраивайте изображения непосредственно в HTML электронные письма как Data URI, когда внешние ссылки на изображения блокируются клиентами или помечаются как спам.
Включайте небольшие изображения в выход пакета webpack/vite, чтобы исключить круговые поездки активов во время запуска приложения.
Вставьте Data URI из инструментов разработчика, источника HTML или файла CSS для предпросмотра и загрузки базового изображения как файла.
Когда встроенное изображение не отображается, вставьте Data URI в декодер, чтобы проверить, действителен ли Base64 и правильный ли тип MIME.
Нажмите на значок Image Base64 в панели DevSuite Pro. Откроется двухпанельная панель с зоной перетаскивания и полем Data URI.
Перетащите файл в зону перетаскивания, вставьте изображение из буфера обмена (Ctrl+V) или нажмите на зону для просмотра. Появится предпросмотр.
Data URI Base64 генерируется немедленно в поле выхода - нажмите Copy, чтобы отправить его в буфер обмена, готов вставить встроенно.
Чтобы перейти Base64 -> изображение, вставьте Data URI в поле. Предпросмотр отображает изображение и появляется кнопка загрузки.
Сохраните реконструированное изображение как реальный файл или скопируйте Data URI для обмена или встраивания в другом месте.
Установите DevSuite Pro бесплатно и разблокируйте более 64 инструментов разработчика для вашего браузера.