Зображення в Base64
Перетворіть зображення на data URI, який можна вставити прямо в CSS або HTML.
- Працює на вашому пристрої — файл нікуди не надсилається
- Без реєстрації, водяних знаків і щоденних квот
- Безкоштовно, без обмежень на кількість використань
Як це працює
Data URI вбудовує зображення безпосередньо у ваш вихідний код, а не посилається на окремий файл. Це прибирає один мережевий запит, що важливо для крихітних зображень, кожне з яких інакше коштувало б окремого обміну із сервером.
Коли це виправдано
Малі значки, логотипи та одноколірна графіка. Нижче приблизно 2 КБ зекономлений запит зазвичай переважує витрати. Вище краще звичайне посилання на файл.
Втрата розміру
Base64 кодує три байти як чотири символи, тож data URI приблизно на 33% більший за файл. Його також не можна кешувати окремо — його завантажують знову з кожною копією таблиці стилів чи сторінки, що його містить.
Куди вставляти
Прямо в CSS url() або атрибут src тега img. Результат уже містить правильний префікс типу медіа.
Зображення в Base64: запитання
Чому існує обмеження розміру?
Data URI належать до вихідного коду, а дуже великі роздувають кожну сторінку, що їх містить. Ліміт — 2 МБ.
Чи працює це з SVG?
SVG — це текст, тож його можна вбудувати напряму без Base64, що менше.
Чи завантажується моє зображення?
Ні. Кодування відбувається у вашому браузері.