Зачем добавлять цвет фона к прозрачному изображению?

У PNG- или WebP-изображения с прозрачным фоном, например логотипа, фотографии товара на прозрачном фоне или наклейки, за объектом ничего нет. Это удобно для веб-страниц, но многие места не поддерживают прозрачность: некоторые приложения отображают её как чёрный фон, JPG не поддерживает её, а интернет-магазины часто требуют однотонный белый фон. Добавление цвета фона заменяет каждый прозрачный пиксель одним сплошным цветом, поэтому получается обычное изображение, которое везде выглядит одинаково.

Описание инструмента

Откройте прозрачное изображение и выберите цвет — по умолчанию используется белый. Предварительный просмотр обновляется сразу, а сравнение до и после показывает результат рядом с исходным изображением с прозрачным фоном. Скачайте изображение в формате PNG, JPG или WebP.

Сглаженные края, тени и другие частично прозрачные пиксели смешиваются с новым цветом так же, как браузер отображает их поверх него, поэтому края остаются плавными. Если в открытом изображении нет прозрачных областей, инструмент сообщит об этом: заполнять нечего.

Возможности

  • Любой цвет фона; по умолчанию используется белый
  • Плавные края: частично прозрачные пиксели смешиваются с цветом
  • Уведомление, если в изображении нет прозрачных областей для заполнения
  • Скачивание в формате PNG, JPG или WebP

Советы

  • Amazon требует, чтобы главное фото товара было на чисто белом фоне; по умолчанию используется #ffffff.
  • Чтобы подобрать цвет под фирменный стиль или страницу, на которой будет изображение, вставьте HEX-код в поле цвета.
  • В результате прозрачность полностью отсутствует, поэтому можно использовать JPG — для фотографий файл часто получается меньше, чем в PNG.