Кодирование
Data URI / Base64 изображения
Кодирование изображения в Data URI (data:image/…;base64,…) для вставки в CSS/HTML и декодирование Data URI или сырого Base64 обратно в файл — всё прямо в браузере.
Просмотр изображения появится здесь.
Часто задаваемые вопросы
Зачем вставлять изображение как Data URI, а не подключать файлом?
Data URI встраивает изображение прямо в CSS или HTML одним значением, что удобно для маленьких иконок и спрайтов — не нужен отдельный HTTP-запрос. Для крупных или часто переиспользуемых изображений это невыгодно.
Есть ли ограничения на размер Data URI?
Да, на практике браузеры и особенно email-клиенты по-разному ограничивают допустимую длину такой строки, и очень большие Data URI могут не сработать или замедлить парсинг страницы. Кроме того, в отличие от обычного файла по URL, Data URI не кешируется браузером отдельно от документа, в который он встроен.
Изображение загружается на сервер для обработки?
Нет, кодирование и декодирование изображения выполняются полностью в браузере, файл никуда не отправляется.