Перейти до уроку
lil cactus

Як додати тінь і обведення за допомогою стилів шару

Початковий6 хвилинОновлено

Коротка відповідь

Виділіть шар і натисніть кнопку Стиль шару (кнопка fx унизу панелі Шари) або виберіть Шар потім Стиль шару потім Стиль шару… Клацніть ефект у списку й налаштуйте його: для білого тексту на світлому фото — ефект Тінь із параметрами Непрозорість 70%, Відстань 4 px і Розмір 10 px, а також стандартне чорне Обведення 3 px. Натисніть кнопку OK. Команди Шар потім Стиль шару потім Копіювати стиль шару і Вставити стиль шару переносять той самий вигляд на інший шар.

Білий текст CLIFF WALK майже губиться на світлому небі, і той самий текст із чорним обведенням і м’якою тінню, а також підзаголовок у тому самому стилі
До: звичайний білий заголовок. Після: тінь і обведення, а також той самий стиль, вставлений у підзаголовок, з тоншим обведенням. Перетягніть повзунок, щоб порівняти.
Час
6 хвилин
Рівень
Початковий
Що потрібно
Текстовий, фігурний або піксельний шар, який має вирізнятися
Підходить для
Текст, фігури, піксельні шари й смарт-об’єкти в документах JPEG, PNG, PSD та інших
Відкрити приклад у Lil CactusВикористати своє фото

Безкоштовно, без реєстрації. Ваше фото залишається на вашому комп’ютері.

Стиль шару — це набір ефектів, які малюються навколо шару або поверх нього: тіні, обведення, світіння, накладання кольору й градієнта, скоси. Ефекти — це параметри, а не пікселі, тому вони повторюють форму шару: змініть текст, і обведення перемалюється навколо нових літер.

У цьому уроці білий текст на світлому небі погано читається. М’яка тінь і тонке обведення це виправляють; потім ви надасте другому рядку той самий стиль двома командами меню.

Як додати стиль шару за сім кроків

  1. Відкрийте фото

    Перейдіть на lilcactus.app і виберіть Файл потім Відкрити… (Ctrl+O або ⌘O) або перетягніть фото у вікно. Щоб точно повторити урок, відкрийте приклад із цієї сторінки.

  2. Введіть білий заголовок

    Натисніть D, а потім X, щоб колір переднього плану став білим (верхній зразок унизу панелі інструментів). Натисніть T, щоб вибрати інструмент Текст. На панелі параметрів (смузі під меню) виберіть Impact у списку Шрифт і введіть 200 у полі Розмір. Клацніть небо праворуч від маяка, приблизно на третину ширини від лівого краю й трохи менше ніж на третину висоти від верху (місце клацання — це нижній край літер), введіть CLIFF WALK і натисніть Ctrl+Enter або ⌘↩. Якщо Impact немає в списку (цей шрифт встановлено не на кожному комп’ютері), виберіть Arial і натисніть кнопку B (жирний) на панелі параметрів.

    Білий на світлому небі майже не дає контрасту: літери ледве відокремлюються від хмар.

    Білі літери CLIFF WALK на світло-сірому небі, які важко прочитати
    Звичайний білий текст на світлому небі.
  3. Додайте тінь

    Натисніть кнопку Стиль шару — кнопку fx унизу панелі Шари. У вікні Стиль шару ліворуч перелічено десять ефектів. Клацніть Тінь: ефект позначиться, а його параметри з’являться праворуч.

    Введіть 70 у полі Непрозорість, 4 у полі Відстань і 10 у полі Розмір. Після кожного значення натискайте Tab (або перетягуйте повзунки): полотно оновлюється, поки вікно відкрите, і м’який темний край тепер відділяє літери від неба. Відстань відсуває тінь від літер у напрямку, заданому параметром Кут; Розмір пом’якшує її.

    Панель «Шари»: режим накладання й непрозорість, рядок блокування, рядки «Текст» і «Фон» і ряд кнопок унизу з обведеною кнопкою fx
    Кнопка fx відкриває вікно «Стиль шару».
    Список ефектів у вікні «Стиль шару»: «Усі ефекти», далі позначений і обведений ефект «Тінь», потім «Внутрішня тінь», «Зовнішнє світіння», «Внутрішнє світіння», «Обведення», «Накладання кольору», «Накладання градієнта», «Накладання візерунка», «Скіс та рельєф» і «Атлас»
    Клацніть назву ефекту, щоб додати його.
    Параметри тіні: режим накладання «Звичайний», чорний зразок кольору, непрозорість 70%, кут 120° з «Використовувати глобальне освітлення», відстань 4 px, розмах 0% і розмір 10 px
    Непрозорість 70, відстань 4, розмір 10.
  4. Додайте обведення й натисніть OK

    Клацніть у списку Обведення. Спочатку це чорний контур 3 px зовні літер — саме те, що потрібно цьому заголовку, тож залиште його. Натисніть кнопку OK.

    Тепер заголовок чітко читається на світлому небі.

    Параметри обведення: режим накладання «Звичайний», чорний зразок, непрозорість 100%, розмір 3 px, положення «Зовні», тип заливки «Колір»
    Обведення за замовчуванням: 3 px, чорне, зовні.
    Білий напис CLIFF WALK із тонким чорним обведенням і м’якою тінню, чітко видимий на світлому небі
    Той самий заголовок із тінню й обведенням.
  5. Змінюйте стиль будь-коли

    Тепер на панелі Шари біля текстового шару є позначка fx. Клацніть її, щоб знову відкрити вікно Стиль шару з поточними параметрами. Зніміть позначку з ефекту, щоб вимкнути його без втрати параметрів, або зніміть позначку Усі ефекти, щоб вимкнути всі ефекти одразу.

    Панель «Шари»: шар «Текст» з обведеною зеленою позначкою fx над шаром «Фон»
    Позначка fx показує, що шар має стиль, і знову відкриває його.
  6. Скопіюйте стиль на другий рядок

    Спершу клацніть рядок Фон: поки виділено текстовий шар, панель параметрів змінює саме його, і значення 64 у полі «Розмір» зменшило б заголовок. Вибравши інструмент Текст, введіть 64 у полі Розмір, клацніть під лівим краєм заголовка, приблизно на половину висоти заголовка нижче його літер (місце клацання знову позначає нижній край літер), введіть Lighthouse loop, 4 miles і натисніть Ctrl+Enter або ⌘↩.

    Виділіть шар заголовка (Текст) і виберіть Шар потім Стиль шару потім Копіювати стиль шару. Виділіть новий шар (Текст 2) і виберіть Шар потім Стиль шару потім Вставити стиль шару. Підзаголовок отримає ту саму тінь і обведення.

    Розміри копіюються в пікселях, тому обведення 3 px заповнює проміжки між дрібними літерами. Клацніть позначку fx на шарі Текст 2, клацніть Обведення, введіть 1 у полі Розмір і натисніть кнопку OK.

    Меню «Шар» з відкритим підменю «Стиль шару»: «Параметри накладання», «Стиль шару», «Глобальне освітлення», далі обведена команда «Копіювати стиль шару», «Вставити стиль шару», «Очистити стиль шару» і «Растеризувати стиль шару»
    Команда «Вставити стиль шару» неактивна, доки ви не скопіюєте стиль.
    CLIFF WALK і менший рядок Lighthouse loop, 4 miles — обидва білі, з чорним обведенням і тінню; обведення підзаголовка тонше
    Підзаголовок із вставленим стилем і обведенням 1 px.
  7. Збережіть проєкт або експортуйте зображення

    Щоб текст і його стиль залишалися редагованими, виберіть Файл потім Зберегти як потім Проєкт Lil Cactus… (Ctrl+Shift+S або ⇧⌘S) або Файл потім Зберегти як потім Photoshop (.psd)… Після цього Файл потім Зберегти оновлює цей файл.

    Щоб поділитися зображенням, виберіть Файл потім Експорт потім JPEG… і натисніть кнопку Експортувати: ви отримаєте нове пласке зображення з уже вбудованими ефектами. Доки ви не збережете проєкт або PSD, Файл потім Зберегти записує пласке зображення назад у відкритий JPEG; перше збереження JPEG, зокрема прикладу, відкриває вікно Зберегти зображення.

Що робить кожен ефект

ЕфектДля чого
ТіньВідокремити текст або вирізаний об’єкт від тла
Внутрішня тіньЛітери, ніби вдавлені в поверхню
Зовнішнє світінняМ’який ореол навколо краю: контраст без різкої лінії
Внутрішнє світінняСвітло вздовж внутрішнього боку краю
ОбведенняКонтур кольором, градієнтом або візерунком — зовні, всередині або по центру краю
Накладання кольоруПерефарбувати шар, не змінюючи його пікселів
Накладання градієнтаТекст або фігури з градієнтною заливкою
Накладання візерункаЗаповнити шар повторюваним візерунком
Скіс та рельєфОпуклі, об’ємні краї
АтласМ’яке глянцеве затінення всередині фігури

Ефекти «Тінь», «Внутрішня тінь», «Обведення», «Накладання кольору» й «Накладання градієнта» можна додати кілька разів, наприклад два обведення різних кольорів: відкрийте ефект і натисніть кнопку Додати копію — кнопку з двома квадратами вгорі праворуч у параметрах ефекту.

Як зробити контурні (порожнисті) літери

Клацніть позначку fx заголовка, зніміть позначку з ефекту Тінь і натисніть кнопку OK: коли заливка дорівнює 0%, тінь просвічувала б крізь порожнисті літери темно-сірою заливкою. Ефект Обведення залиште.

Потім на панелі Шари задайте для параметра Заливка значення 0%. Заливка приховує власні пікселі шару, але зберігає його ефекти, тож залишається лише контур, а крізь літери видно фото. Параметр Непрозорість над ним приглушує й ефекти.

Панель «Шари» з обведеним полем «Заливка» в рядку блокування, значення 0%, над рядками «Текст», «Текст 2» і «Фон»
Заливка 0% на панелі «Шари».
CLIFF WALK у вигляді чорних контурів, крізь літери видно світле небо
Лише обведення із заливкою 0%: контурні літери.

Інші команди стилю шару

  • Шар потім Стиль шару потім Глобальне освітлення… задає один кут освітлення для всіх тіней і скосів, у яких увімкнено параметр Використовувати глобальне освітлення, тож усі вони падають в один бік.
  • Шар потім Стиль шару потім Очистити стиль шару вилучає всі ефекти з виділеного шару й повертає параметру Заливка значення 100%.
  • Шар потім Стиль шару потім Растеризувати стиль шару перетворює шар і його ефекти на один піксельний шар: після цього текст не можна переписати, а ефекти — налаштувати.

Розв’язання типових проблем

Команда «Вставити стиль шару» неактивна

У цій вкладці браузера ще нічого не скопійовано, або виділений шар заблоковано. Спершу виберіть Шар потім Стиль шару потім Копіювати стиль шару на шарі зі стилем і перевірте значок замка на панелі Шари. Скопійований стиль зберігається, доки ви не перезавантажите сторінку, тож його можна вставити й в інший відкритий документ.

Після вставлення стилю літери зникли

Скопійований стиль містив значення 0% для параметра Заливка. Поверніть параметру Заливка значення 100% на панелі Шари.

Тінь обрізається на краю зображення

Ефекти малюються лише в межах полотна. Пересуньте шар усередину або збільште полотно командою Зображення потім Розмір полотна…

Якщо ви переходите з іншого редактора

Photoshop
Кнопка fx унизу панелі «Шари» і меню «Шар › Стиль шару» з командами «Копіювати стиль шару» та «Вставити стиль шару».
GIMP
Filters › Light and Shadow › Drop Shadow.

Стилі шару: запитання та відповіді

Чи змінюють стилі шару пікселі мого шару?

Ні. У Lil Cactus стиль шару — це набір параметрів, які малюються навколо шару, тож його можна будь-коли змінити або вилучити. Команди «Шар › Стиль шару › Растеризувати стиль шару», «Об’єднати з нижнім», «Об’єднати видимі» і «Звести зображення» перетворюють ефекти на пікселі; доти вони залишаються редагованими.

Чи зберігаються стилі шару у файлах PSD?

Так. У Lil Cactus команда «Файл › Зберегти як › Photoshop (.psd)…» зберігає стилі шару редагованими. Виняток — стиль із 16-бітним візерунком або шумом скосу: Lil Cactus покаже такий шар і запитає перед збереженням, а вигляд шару буде збережено як пікселі.

Як додати тінь за вирізаним об’єктом, а не за текстом?

У Lil Cactus розмістіть об’єкт на окремому шарі з прозорим фоном, а потім додайте ефект «Тінь» кнопкою fx. Тінь повторюватиме контур об’єкта.

Як застосувати той самий стиль до кількох шарів?

У Lil Cactus виберіть «Шар › Стиль шару › Копіювати стиль шару» на шарі зі стилем, а потім по черзі виділяйте кожен інший шар і вибирайте «Вставити стиль шару»; стиль вставляється лише в один шар за раз. Вставлення замінює стиль, який мав шар.

Як змінити колір тіні або обведення?

У Lil Cactus відкрийте стиль шару, клацніть ефект і клацніть зразок кольору в правому кінці рядка «Режим накладання». Виберіть колір і натисніть OK в обох вікнах.

Чи завантажується моє фото на сервер, коли я використовую стилі шару в Lil Cactus?

Ні. Усе працює у вашому браузері, на вашому пристрої. Коли статистику ввімкнено, редактор записує, які інструменти використовуються, але ніколи не саме зображення, як пояснює політика конфіденційності.