В каком формате сохраняется прозрачный фон: 2.3. Сохранение изображений с прозрачностью

Содержание

Как сделать пнг картинку в фотошопе (PNG в Adobe Photoshop)?

2021-02-16

Иногда нужно загрузить изображение, содержащее прозрачные элементы, сквозь которые будет проглядывать первоначальный фон. В этих случаях, было бы удобно загрузить PNG изображения, поскольку они способны сохранять прозрачность.

В этой статье мы расскажем, как сделать картинку в формате PNG в Фотошопе.

Как сделать файл PNG в Adobe Photoshop?
Как сделать фото в пнг с помощью Adobe Photoshop версии ранее, чем CC 2015
Как сделать пнг файл с помощью Photoshop версии CC 2015

Первый шаг – это создание файла. Для этого откройте Adobe Photoshop и в меню «Файл» (File) вверху страницы выберите «Создать» (New).

Затем в появившемся окне «Новый документ» (New Document) создайте файл нужного размера, и убедитесь, что разрешение документа составляет 72 пикселя на дюйм (поскольку файл предназначен для использования в веб). А также, что вы выбрали значение «Прозрачный» (Transparent) в выпадающем списке «Содержимое фона» (Background Contents).

Перед тем, как сделать PNG в фотошопе, нужно уточнить, что в этом примере мы создаем изображение для загрузки в качестве фона для сайта, поэтому размер документа задан следующим образом: ширина 3000 пикселей, высота 1730 пикселей, что является рекомендуемыми размерами для загрузки HD изображений:

После того, как вы задали значения параметров, нажмите «OK», чтобы открыть новый документ.

Затем в панели «Слои» (Layers) убедитесь, что работаете на прозрачном слое, а не на фоновом:

После того, как вы завершили создание и готовы сохранить прозрачное изображение, в зависимости от используемой версии Photoshop, в меню «Файл» (File) вы можете использовать один из возможных вариантов:

Сейчас мы расскажем, как сделать прозрачность картинки в Фотошопе, который вышел раньше CC 2015. В этих версиях используют метод «Сохранить для Web» (Save for Web & Devices), чтобы сохранить и оптимизировать PNG изображения для использования в вебе. Чтобы воспользоваться этим методом, просто зайдите в меню «Файл» (File), и далее – «Сохранить для Web» (Save for Web & Devices):

Затем в появившемся окне выберите PNG-24 из выпадающего меню возможных значений, а потом убедитесь, чтобы выбраны опции «Прозрачность» (Transparency) и «Преобразовать в sRGB» (Convert to sRGB). Это подтверждает, что изображение будет содержать прозрачный фон и его цветовой режим будет преобразован в sRGB, рекомендованное цветовое пространство для веб.

Поля «Размер изображения» (Image Size) автоматически заполняются значениями, которые вы задали, когда создавали файл. Но если вы хотите изменить размер файла перед сохранением, то можно сделать это сейчас.

Чтобы сохранить изображение, нажмите кнопку «Сохранить» (Save) внизу окна.

Перед тем, как сделать прозрачность фото в Фотошопе, нужно знать, что с версии CC 2015 опция «Сохранить для Web» (Save for Web & Devices) в меню «Файл» (File) помечена как Legacy (устаревшая). И замещена на новую опцию «Экспорт» (Export), которая предлагает идентичную функциональность с более быстрым сохранением в файле меньшего размера и в лучшем качестве. Чтобы воспользоваться опцией «Экспорт», нажмите меню «Файл» (File), а затем — «Экспортировать как» (Export As).

Примечание: Adobe по-прежнему предлагает опцию «Сохранить для Web» (Save for Web & Devices) в Photoshop CC 2015, и она доступна через меню Файл > Экспорт (File > Export) или при использовании комбинации клавиш Command+Option+Shift+S (для Mac) или Ctrl+Alt+Shift+S (для ПК):

Затем в появившемся окне выберите PNG из выпадающего меню «Формат» (Format) и убедитесь, что выбраны опции «Прозрачность» (Transparency) и «Преобразовать в sRGB» (Convert to sRGB).

Поля «Размер изображения» (Image Size) и «Размер холста» (Canvas Size) должны автоматически заполниться значениями, которые вы задали, когда создавали файл. Но при желании можно изменить эти параметры перед тем, как сделать эффект прозрачности в Фотошопе:

Когда закончите, нажмите «Экспортировать все» (Export All).

МЛМария Логутенкоавтор-переводчик статьи «How can I create a PNG with transparency in Adobe Photoshop (CC and higher)?»

Как сделать фон прозрачным в картинке в Paint 3d

Если вы не знаете, как сделать прозрачный фон в картинке, то в этом вам поможет стандартный графический редактор, включенный в список программ Window 10, Paint 3d. Он, конечно, рассчитан в первую очередь на работу с 3д объектами, однако легко справится с такой задачей, как установка прозрачного фона для картинки. Также с помощью этой программы вы сможете сделать фон прозрачным в уже существующей картинке или фотографии, удалив всё за объектом.

В обычном редакторе изображений Paint от Microsoft нельзя сделать фон прозрачным.

Делаем прозрачный фон на картинке

Открываем программу Paint 3d и создаем новый документ. По умолчанию у нас появится холст в виде белого прямоугольника. Если вы хотите что-то нарисовать на прозрачном фоне, то для этого нужно выполнить одно простое действие: на панели инструментов нажимаем на Холст, и в появившемся слева меню передвигаем ползунок под «Прозрачный холст» в положение Вкл.

Все, теперь у нас холст стал невидимым, а его границы отмечены тонкой рамочкой – чтобы при рисовании не выйти за его пределы. После того, как будет нарисован рисунок, его обязательно нужно сохранить в формате JPG или PNG. В любом другом формате вместо прозрачного появится белый фон. Для этого заходим в Меню – Сохранить как – Изображение и выбираем формат JPG или PNG.

Как видите, ничего сложного в создании прозрачного холста при помощи программы Paint 3d нет. Однако не всегда приходится рисовать на готовом холсте, иногда нужно убрать фон с уже готового изображения. И тут уже простым нажатием на «Прозрачный фон» делу не поможешь, но и на этот случай у программы Paint 3d есть решение.

Как сделать прозрачный фон в фотографии в Paint 3d

Для начала открываем фотографию, в которой нужно сделать фон прозрачным: Меню – Открыть – Обзор файлов и находим нужную картинку, либо просто перетягиваем файл изображения с папки на рабочую область Паинт 3д.

Далее нажимаем на кнопку Волшебное выделение (1), которая находится в верхней панели инструментов. Если объект, который нужно оставить на прозрачном фоне, слишком маленький по сравнению с фоном, подтягиваем кружочки (2) по его периметру, чтобы программа смогла понять, что мы пытаемся Волшебно выделить. После этого нажимаем на Далее.

У вас должен выделиться нужный объект по контуру, как показано на скриншоте. Возможно, некоторые части будут выступать за зону выделения, либо наоборот, не будут выделены. Чтобы объект выделился ровно по контуру, пользуемся кнопкой Добавить (1) и кнопкой Удалить (2).

Так, у меня программа криво обрезала левую часть фотографии собаки. Нажимаю на кнопку Добавить и дорисовываю площадь, которая должна быть выделена:

В результате вот, что получилось. После того, как довыделяли все что нужно, нажимаем на кнопку Готово.

Теперь копируем выделенное изображение в буфер обмена. Для этого нажимаем на соответствующую кнопку:

Создаем новый документ, предыдущий можем не сохранять. Нажимаем на Холст и передвигаем ползунок на Прозрачный холст (все то же самое, как в первой части статьи). И после этого нажимаем на Вставить с верхней панели.

Все, теперь наше изображение стало с прозрачным фоном. Его можно добавлять на любой другой фон, либо сохранить в таком же виде. Напоминаю, фотографии с прозрачным фоном сохраняются только в форматах JPG или PNG.

Сделать фон Photoshop прозрачным, удалить или сохранить его

Вы успешно вырезали изображение, но что делать дальше? Как сделать фон прозрачным в фотошопе? В нашем уроке вы научитесь сохранять предметы с прозрачным фоном и редактировать их в Photoshop.

Вырезание объекта в графическом редакторе, таком как Photoshop или Affinity, может занять довольно много времени. Чтобы оправдать усилия, важно знать, как можно в дальнейшем редактировать вырезанный объект с прозрачностью без потери информации. Чтобы убедиться, что у вас есть изображение в правильном формате для предполагаемой цели, есть несколько вещей, которые следует учитывать при сохранении изображения.

Содержание

Прозрачный фон в Photoshop: разблокировка слоев
Вырезание объектов — одна из многих возможностей
Photoshop: прозрачный фон для изображений в цветовом пространстве RGB
Прозрачный фон в цветовом пространстве CMYK для печати проекты

Прозрачный фон в Photoshop: разблокировка слоев

В нашем примере мы хотим вырезать руку, держащую лист, из фона (голубое небо). Первый шаг — импортировать или открыть изображение в Photoshop. Объект будет создан автоматически в качестве фона в размере нашего изображения. Для некоторых приложений имеет смысл работать с этим заблокированным фоновым слоем. Но в большинстве случаев вам понадобится редактируемое изображение. Для этого вам нужно разблокировать фоновый слой или преобразовать изображение в обычный слой.

Это можно сделать двумя способами: Дважды щелкните фоновый слой и подтвердите открытие рабочей области. Или перетащите маленький значок замка на значок мусорной корзины в правой нижней части окна слоев. Это удалит блокировку фона, и теперь вы можете перетаскивать изображение в любое место в окне проекта.

Внешний вид прозрачных пленок в Photoshop: При перемещении изображения ваш объект будет отображаться на фоне серо-белой шахматной доски. Вот как Photoshop отображает прозрачность и сообщает вам, что в этой позиции окна проекта нет другого содержимого, кроме пустого и прозрачного пространства.

Вырезание объектов – одна из многих возможностей

На следующем этапе мы хотим отделить объект от фона. Поскольку между рукой, держащей лист, и голубым небом есть хороший контраст, это изображение идеально подходит для вырезания, особенно с использованием нового инструмента «Выбор объекта» в Photoshop 2020.

Использование инструмента «Выбор объекта» для вырезания как: выберите инструмент «Выделение объекта» на панели инструментов и примерно обведите область, которую хотите вырезать. Photoshop должен автоматически определить края и сделать предварительный выбор. Затем нажмите «Выбрать и замаскировать» в верхнем меню. В этой рабочей области вы можете уточнить выбор, чтобы получить почти идеальный результат за короткое время. В нашем примере инструмент «Выбор объекта» в Photoshop уже дал очень хороший результат.

Уточнение краев для идеального результата

Чтобы уточнить этот выбор, снова нажмите «Выбрать и замаскировать» в верхнем меню и используйте инструмент «Уточнить края кисти» на левой панели инструментов, чтобы нарисовать контуры листа и кончики пальцев. Если вас еще не устраивает пересмотренный выбор объекта, вы можете дополнительно определить умный радиус в 1 пиксель в правом окне настроек.

Затем перейдите в «Настройки вывода» и установите флажок «Обеззараживать цвета». Ваш исходный файл будет сохранен, а область вырезания будет создана как отдельный слой. Наконец, подтвердите рабочую область, нажав кнопку «ОК», и ваш вырезанный объект будет отображаться: Рука с листом отображается в Photoshop на прозрачном фоне, то есть в виде серо-белой шахматной доски.

Цветовое пространство RGB — делаем фон прозрачным в Photoshop

Вырезанный объект представляет собой изображение в цветовом пространстве RGB. RGB — это идеальное цветовое пространство, если вы хотите опубликовать свое изображение в цифровом виде, например, на экранах или в Интернете. Photoshop позволяет сохранять изображение с прозрачностью непосредственно для публикации в Интернете. Чтобы сохранить прозрачность, вам нужно только выбрать правильный формат при сохранении изображения.

PNG обеспечивает прозрачность цифровых изображений.

Нажмите на файл, а затем Сохранить как. Откроется новое окно. Выберите здесь PNG в разделе Тип файла. PNG (Portable Network Graphics) — это формат графических файлов, который поддерживает сжатие данных без потерь и является наиболее широко используемым графическим форматом без потерь во всемирной паутине. PNG также может отображать прозрачность в цветовом пространстве RGB, что делает его идеальным для сохранения вырезанного объекта.

Наконец, сохраните файл под уникальным именем и нажмите Сохранить. В следующем окне вы можете настроить уровень сжатия файла. Нажмите «ОК», чтобы подтвердить настройки и сохранить изображение в формате PNG с прозрачностью. Теперь вы можете перетащить сохраненный файл изображения прямо в новый документ Photoshop. После того, как изображение будет вставлено, вы увидите только вырезанный объект.

Важно: Впоследствии восстановить удаленный фон невозможно, поскольку PNG игнорирует эту информацию об изображении при сохранении файла.