Как сделать тень на фото онлайн или в программе: инструкция для Photoshop, Illustrator и Figma

Рассказываем, как сделать тень на фото, чтобы изображение выглядело реалистичнее.
Главное
Photoshop
Figma
Illustrator
Онлайн
Главное
Photoshop
Figma
Illustrator
Онлайн
Еще
Девушка делает тень на фото в программе
Сделать тень проще всего в онлайн-программе Источник: Freepik

Чтобы фотография или картинка выглядела более объемной и реалистичной, часто используют эффект тени. Его можно настроить вручную в графических редакторах или создать автоматически в онлайн-сервисах. В инструкции разберем, как добавить тень в популярных программах — Adobe Photoshop, Illustrator и Figma, а также покажем, как быстро получить результат с помощью онлайн-сервисов. 

Главное о создании теней на картинках и фото

  • Добавить тень к объекту можно в Photoshop, Illustrator, Figma или с помощью онлайн-сервисов.

  • Сделать тень проще всего онлайн: за пользователя все дорисовывает ИИ, не нужно разбираться в инструментах.

  • В Photoshop и Illustrator тень добавляется двумя способами: через параметр «Тень» или инструмент «Эллипс».

  • В Figma можно добавить внешнюю и внутреннюю тень на картинку с помощью пары кнопок.     

Как сделать тень на фото в Adobe Photoshop

Есть два способа быстро сделать тень на фото в Photoshop. Ниже делимся пошаговой инструкцией. Для экспериментов использовали изображение с Freepik.

С помощью эффекта «Тень» 

1. На панели Layers (Слои) дважды кликните левой кнопкой мыши, открыв меню Layer Style (Стиль слоя).

Панель Слои в Adobe Photoshop для наложения эффекта Тень
Откройте Стиль слояИсточник: Hi-Tech Mail / Freepik

2. В открывшемся меню выберите параметр Drop Shadow (Тень).

Окно Слои в Adobe Photoshop с параметрами наложения эффекта Тень
Выберите параметр ТеньИсточник: Hi-Tech Mail / Freepik

3. Экспериментируйте с параметрами Opacity (Прозрачность) Angle (Угол), Distance (Смещение), Spread (Размах) и Size (Размер), чтобы добиться необходимого вам результата. 

Панель Слои в Adobe Photoshop для наложения эффекта Тень, изменения угла и других параметров
Настройте прозрачность, угол и другие параметрыИсточник: Hi-Tech Mail / Freepik

С помощью инструмента «Эллипс»  

1. С помощью инструмента Ellipse Tool (Эллипс) создайте эллипс черного цвета. Задайте нужный цвет атрибутами Fill (Заливка) и Stroke (Обводка).

Создание эллипса с помощью панели инструментов в Adobe Photoshop
Создайте эллипсИсточник: Hi-Tech Mail / Freepik

2. Если нужно, переместите или измените созданный объект с помощью инструмента Move Tool (Перемещение).

Инструмент Перемещение в Adobe Photoshop для создания эллипса
Переместите объект, чтобы он больше подходил к предметуИсточник: Hi-Tech Mail / Freepik

3. На панели Слоев кликните правой кнопкой мыши на пространство рядом с названием нужного слоя. Откроется контекстное меню. Выберите опцию Convert to Smart Object (Преобразовать в Смарт-объект).

Параметры в Adobe Photoshop для преобразования созданного эллипса в смарт-объект
Преобразуйте в смарт-объектИсточник: Hi-Tech Mail / Freepik

4. Далее на верхней панели выберите функцию Filters → Blur →Gaussian Blur (Фильтры → Размытие → Размытие по Гауссу. Обратите внимание: чтобы инструмент применился, обязательно должен быть выбран необходимый слой. 

Инструмент Размытие для преобразования эллипса в тень объекта
С помощью размытия измените эллипсИсточник: Hi-Tech Mail / Freepik

5. Передвигайте ползунок Radius до удовлетворяющего вас результата. Нажмите OK.

Панель сохранения созданного эллипса в Adobe Photoshop
Сохраните понравившийся результатИсточник: Hi-Tech Mail / Freepik

6. При необходимости можно изменить параметр Opacity (Прозрачность) на панели Слоев, сделав тень бледнее.

Параметр прозрачности для эллипса в Adobe Photoshop
С помощью прозрачности сделайте тень бледнееИсточник: Hi-Tech Mail / Freepik

Как создать тень на картинке в Figma

1. Выделите объект. Справа появится панель настроек. Вам нужно меню Effect (Эффекты) → Drop Shadow.

Выделенный объект с параметром Effect для создания тени на картинке в Figma
Выделите объект и выберите Effect → Drop ShadowИсточник: Hi-Tech Mail / Freepik

2. В появившемся окне настраивайте ползунки X (Смещение по оси X), Y (Смещение по оси Y), Blur (Размытие), Spread (Размах) и Color (Цвет) до удовлетворяющего вас результата. Эффект отображается на объекте сразу же.

Параметры Drop Shadow для создания реалистичной тени на картинке в Figma
Настройте параметры, чтобы тень получилась реалистичнойИсточник: Hi-Tech Mail / Freepik

3. Можно придать объекту объем, добавив еще один эффект из этой же панели — Inner Shadow (Внутренняя тень). Ползунки настройки аналогичны. 

Параметр Inner shadow для создания тени на картинке в Figma
Добавьте внутреннюю теньИсточник: Hi-Tech Mail / Freepik

4. Чтобы добавить новый эффект объекту, не заменяя предыдущий, нажмите на + рядом со строкой Effects на панели.

Созданный объект с тенью на картинке в Figma
Нажав +, можно добавить новый эффект, а не менять предыдущий Источник: Hi-Tech Mail / Freepik

Как сделать тень в Adobe Illustrator

Как и в случае с Photoshop, способов два.

Девушка, фото, селфи

С помощью эффекта «Тень»  

1. На панели Properties (Свойства) выберите кнопку Choose an Effect (Выбрать Эффект) → Stylize (Стилизовать) → Drop Shadow (Тень).

2. Если панели Properties нет на рабочей области, ее необходимо включить через верхнюю панель Window → Properties.

Окно свойств для создания эффекта Тень в Adobe Illustrator
Включите Properties (Свойства), чтобы наложить тень на фото в Adobe IllustratorИсточник: Hi-Tech Mail / Freepik

3.В открывшемся окне изменяйте параметры Mode (Способ наложения), Opacity (Прозрачность), X Offset (Смещение по оси X), Y Offset Смещение по оси Y) и Blur (Размытие) до удовлетворяющего вас результата. 

Если нажмете галочку Preview, изменения будут отображаться сразу. 

С помощью инструмента «Эллипс»  

1. С помощью инструмента Ellipse Tool (Эллипс) нарисуйте эллипс и переместите его под объект на панели Layers (Слои).

Инструмент Эллипс для создания тени в Adobe Illustrator
Сделать тень поможет инструмент «Эллипс»Источник: Hi-Tech Mail / Freepik

2. На панели Properties (Свойства) в строке Fill (Заполнение) выберите режим Gradient (Градиент) и нажмите кнопку Radial Gradient (Радиальный градиент).

Инструмент Градиент для создания тени в Adobe Illustrator
Заполните эллипс градиентомИсточник: Hi-Tech Mail / Freepik

3. Ниже на слайдере выберите белый кликом левой кнопки мыши по нему. Поставьте нулевой параметр Opacity (Прозрачность).

Инструмент Прозрачность для создания тени в Adobe Illustrator
Задайте для эллипса-тени нулевую прозрачностьИсточник: Hi-Tech Mail / Freepik

4. После этого выберите на панели инструментов Gradient (Градиент), сохраняя выделенным эллипс. На нем появятся ползунки настройки градиента. Передвигайте их до удовлетворяющего вас результата. 

5. С помощью инструмента Selection (Выделение) передвиньте и/или трансформируйте эллипс, если нужно.

Тень можно дополнительно размыть с помощью опции Blur. Откройте Properties → Choose an Effect. Обязательно сохраняйте нужный вам объект выделенным, чтобы на панели Properties отображались необходимые свойства.

Как добавить тень на фото онлайн

Добавить тень можно в онлайн-сервисах, которые используют нейросети. Это быстро и удобно. 

1. Загрузите фото. Мы воспользовались изображением с Unsplash

2. Выберите тип тени и нажмите «Добавить». 

3. Скачайте сгенерированный результат.

Окно онлайн-сервиса, в котором можно добавить тень на фото
Добавить тень для любого объекта можно с помощью онлайн-сервисовИсточник: Hi-Tech Mail / Unsplash

Мы протестировали сервис Photoroom. Аналогичные опции есть в SnapEdit, PhotoCut и на десятках других сайтов. Единственная сложность — количество генераций в день может быть ограничено, поэтому проверяйте условия использования конкретного сайта.