Зображення в Base64
Перетягніть зображення сюди або клікніть, щоб обрати файл
PNG, JPEG, GIF, WebP, SVG, AVIF — обробка локальна, нічого не завантажується.
Про конвертер зображень у Base64
Кодування Base64 перетворює бінарні дані зображення на текст, тож зображення можна вбудувати прямо в HTML, CSS, JSON чи Markdown як data URI замість окремого файлу.
Цей конвертер читає файл локально через FileReader API і видає повний data URI, чистий Base64 та готові до вставки сніпети CSS і HTML. Зображення ніколи не покидає ваш пристрій.
Як конвертувати зображення в Base64
- Перетягніть зображення в зону завантаження або клікніть, щоб обрати файл.
- Перевірте попередній перегляд та інформацію про збільшення розміру.
- Скопіюйте потрібний data URI, чистий Base64, CSS- чи HTML-сніпет.
- У зворотний бік: вставте data URI в поле декодування й перегляньте його.
Поради
- Base64 додає приблизно 33% до розміру файлу — інлайньте лише малі зображення, як-от іконки та логотипи.
- Інлайнені зображення не кешуються окремо; вони завантажуються заново з кожною сторінкою.
- Спочатку стисніть чи зменшіть зображення: кодування нічого не зменшує.
- Для простих іконок інлайновий SVG зазвичай виграє в Base64 PNG і за розміром, і за чіткістю.
Що перевірити перед інлайнінгом зображень у Base64
Інлайнінг прибирає запит, але збільшує сторінку та блокує кешування. Переконайтесь, що компроміс виправданий для кожного ресурсу.
Інлайньте лише малі зображення
Base64 додає приблизно 33% обсягу, а рядок роздуває HTML чи CSS. Інлайньте іконки й дрібну графіку, а не фото.
Врахуйте вплив на кешування
Інлайнене зображення завантажується заново з кожним документом замість одноразового кешування окремим файлом.
Стискайте перед кодуванням
Base64 нічого не стискає. Спочатку оптимізуйте чи зменшіть зображення, потім кодуйте менший файл.
Де можливо — використовуйте SVG
Для простих іконок інлайновий SVG зазвичай менший і чіткіший за растрове зображення в Base64.
Пов’язані інструменти
Можливо, тобі також стануть у пригоді ці інструменти.