Mia Hartley 
Текстовый эффект - это всё, что происходит со словом после того, как выбран шрифт: заливка, контур, тень позади, объём под ним, свет на его поверхности. Шрифт даёт формы букв. Эффект - это то, что заставляет эти формы выглядеть как золото, как неоновая вывеска, как что-то горящее.
Получить его можно тремя способами. Вы набираете слово в генераторе и скачиваете картинку, открываете многослойный PSD в Photoshop или пишете CSS, который так и живёт только в браузере. Эта страница о первом способе, а путь через PSD описан ниже, для тех, кому нужны слои.
Дальше идут двенадцать семейств, в том порядке, в каком их действительно ищут. Каждый образец по-настоящему отрисован генератором красивого текста на TextStudio, а словом послужило название самого эффекта, так что здесь нет ни одного макета. Нажмите на любую картинку, чтобы открыть именно этот стиль и вписать в него свои слова. Ни один из двенадцати не относится к премиум-стилям.
1. Текстовый эффект 3D
Объём - самый старый приём в наборе и по-прежнему самый полезный: у букв появляется выдавленный бок, источник света и опора, поэтому они перестают быть краской и становятся предметом.
Изометрический объём вроде этого читается в любом размере, поэтому логотипы и превью к нему постоянно возвращаются. Альтернатива - мягкая перспективная экструзия, которая лучше смотрится крупно и превращается в кашу мелко. Если нужна более старая, угловатая версия той же идеи, её собрали стили Word Art.
Подходит для: логотипов, превью видео, плакатов, всего, что должно пережить уменьшение.
2. Золотой текстовый эффект
Золото - это не цвет, это рецепт: тёплый градиент, тёмный сверху и светлый посередине, жёсткий скос по краю и блик там, куда падает свет. Залейте букву плоским жёлтым, и получится банан.
Синий за ним тоже не украшение. Золоту нужна холодная тёмная основа, чтобы выглядеть металлом, поэтому наградные плакаты, новогодние поздравления и люксовые этикетки в итоге оказываются на тёмно-синем или чёрном фоне. Больше таких примеров - в руководстве по золотым текстовым эффектам.
Подходит для: приглашений, новогодних постов, дипломов, логотипов, которые хотят выглядеть дорого.
3. Неоновый текстовый эффект
Неоновый эффект - это обводка, которая излучает свет: яркое ядро, цветной ореол, растекающийся наружу, и тёмная поверхность, на которую этот свет ложится. На белом фоне он исчезает, и никакой настройкой это не исправить.
Трубчатый неон, тот самый, что висит над баром, сохраняет видимый контур и тонкий неосвещённый зазор внутри буквы. Стили светодиодных вывесок отказываются от трубки и берут вместо неё точки света. Больше светящихся стилей в подборке неоновых шрифтов.
Подходит для: приглашений на вечеринку, оверлеев для стримов, тёмных шапок сайтов, всего, что должно выглядеть вывеской.
4. Огненный текстовый эффект
Поджечь слово можно двумя способами, и выглядят они по-разному. Либо пламя рисуют поднимающимся от верхушек букв, либо сами буквы сделаны из углей и светятся изнутри.
Пламя над буквами оставляет слово читаемым, а это важно, если это имя. Буквы, залитые углями, выглядят жарче и читаются хуже. Восемь вариаций, включая лаву и мультяшный огонь, собраны в руководстве по огненным шрифтам.
Подходит для: игровых превью, спортивных и концертных афиш, всего, что должно кричать.
5. Хромированный текстовый эффект
Хром - это градиент с горизонтом внутри. Весь фокус в жёсткой линии поперёк середины каждой буквы, там, где отражённое небо встречается с отражённой землёй: уберите её, и получится серый пластик.
Серебро, сталь и хром - одно семейство с разной степенью контраста. Возрождение Y2K вернуло их все разом, а больше таких стилей - в металлических и хромированных шрифтах.
Подходит для: дипломов, автомобильных и спортивных логотипов, дизайна в духе Y2K, всего металлического.
6. Текстовый эффект с блёстками
Настоящие блёстки - это текстура внутри букв плюс рассыпанная пыль вокруг них. Поддельная версия - гладкий золотой градиент с нарисованным сверху сиянием, и, однажды увидев разницу, вы уже не сможете её развидеть.
Блёстки - единственный эффект, который в печати теряет почти весь смысл, потому что искры собраны из крошечных ярких пикселей, а принтер их усредняет. Этот эффект сделан для экранов. В руководстве по блестящим шрифтам есть способ отличить настоящие искры от нарисованного блеска.
Подходит для: постов ко дню рождения, приглашений на вечеринку, шапок профилей, всего, что нацелено на экран телефона.
7. Текстовый эффект с контуром
Одна обводка вокруг слова отделяет его от всего, что позади. Именно ради этого его используют в мемах и превью: подпись остаётся читаемой на фотографии, которую никто не контролирует.
Сложите несколько обводок разных цветов, и слово получит ореол, достаточно толстый, чтобы лечь на что угодно: так и выглядят наклейки. Каждый лишний контур съедает форму букв, поэтому на плакате он работает, а на маленьком превью проваливается. Механика описана в руководстве по обводке текста.
Подходит для: мемов, стикеров, подписей поверх фото и видео.
8. Текстовый эффект с тенью
Тень решает сразу две задачи: приподнимает слово над фоном и сообщает, где находится свет. Мягкая тень - инструмент контраста. Жёсткая смещённая тень - стиль.
Длинная тень выше - это версия из плоского дизайна, одна сплошная фигура под сорок пять градусов, без размытия. Мягкая падающая тень - повседневная, и она должна быть настолько сдержанной, чтобы её никто не заметил: именно её объясняет тень текста.
Подходит для: плакатов в плоском дизайне, экранов приложений, заголовков слайдов, подписей, которым нужен контраст без контура.
9. Цветной текстовый эффект
Цвет становится самостоятельным эффектом, как только перестаёт быть однородным: по цвету на букву или градиент через всё слово.
Цвет на каждую букву - это то, о чём на самом деле просят детские праздники, школьные классы и радужные посты, когда ищут цветной текст. Градиент через слово сейчас стал стандартом в коротких видео. Восемь цветов и то, где уместен каждый, разобраны в цветных текстовых эффектах.
Подходит для: материалов ко дню рождения и для класса, обложек плейлистов, всего, что должно выглядеть дружелюбно.
10. Текстовый эффект граффити
Граффити - это не один стиль, а целое семейство: быстрый тег, жирный throw-up, блокбастер, вайлдстайл, который и не должен читаться.
Тег вроде этого - это подпись, поэтому лучше всего в него ложится имя. Девять стилей начертания, их названия на стене и назначение каждого показаны на одном и том же слове в шрифтах граффити.
Подходит для: обложек альбомов, стритвира, игровых ников, скейт-материалов и оформления молодёжных клубов.
11. Пузырьковый текстовый эффект
Пузырьковые буквы надуты: круглые плечи, толстый контур и блик там, куда сверху падает мягкий свет. Они выглядят юными и дружелюбными ещё до того, как прочитано хоть одно слово.
Здесь есть важная развилка. Пузырьковые буквы как картинка, вроде этой, представляют собой нарисованные формы, которые вы скачиваете. Пузырьковые буквы для копирования и вставки - это символы Unicode, которые можно вставить в описание профиля, но раскрасить их нельзя никогда. Руководство по пузырьковым буквам охватывает и то и другое, а заодно и то, как нарисовать их от руки.
Подходит для: открыток ко дню рождения, оформления класса, наборов стикеров, всего детского.
12. Ретро текстовый эффект
Ретро - это десятилетие, а не внешний вид, и выбрать не то десятилетие - самая частая ошибка на этой странице. Груви-семидесятые круглые и тёплые. Восьмидесятые в духе аркад - это хром и сетки. Y2K - это пузырьковый металл на синем рабочем столе.
Версия семидесятых выше вернулась сильнее всех, и на кофейной упаковке, и на фестивальных афишах. Больше стилей этого возрождения в ретро-шрифтах.
Подходит для: фестивальных афиш, упаковки, мерча групп, всего ностальгического.
Ещё шестнадцать стилей, одно слово
Двенадцать семейств выше покрывают то, что ищут люди. Каталог на этом не заканчивается, а остальное проще оценить на одном слове, чем на двенадцати.
Сюда стоит смотреть, когда эффект должен соответствовать теме, а не настроению: рождественская открытка, спортивный плакат, листовка садового центра, приглашение на праздник со словом, выложенным цветами.
Из чего на самом деле состоит текстовый эффект
Каждый стиль выше - это стопка из одних и тех же четырёх слоёв, наложенных в одном и том же порядке. Как только вы научитесь видеть их по отдельности, вы сможете собрать любой из них и сказать, что не так с тем, который не работает.
Заливка - это цвет, градиент или текстура внутри букв. Контур - это обводка вокруг них, и именно он позволяет слову выжить на пёстром фоне. Тень отделяет слово от поверхности и задаёт направление света. Объём выдавливает буквы в сплошное тело.
Золото - это заливка плюс скос. Неон - это светящийся контур без заливки. Подпись к мему - это простая заливка и жирный контур. Больше ничего не происходит.
Как сделать эффект за пять шагов
Шаг 1. Сначала наберите своё слово
Эффект подгоняется под слово, а не наоборот. Стиль, который идеально смотрится на трёх буквах, может сломаться на одиннадцати, и лучше узнать это до того, как вы выбрали цвета.
Шаг 2. Возьмите стиль, ближайший к задуманному
Не начинайте с пустого редактора. Каждый стиль на этой странице открывается как готовый рабочий эффект с вашим текстом внутри, а править готовое быстрее, чем собирать с нуля.
Шаг 3. Меняйте цвета раньше всего остального
Цвет несёт большую часть характера. Тот же скос, который читается как золото, в сером читается как хром, а в розовом как карамель, и для этого не нужно трогать ни одну другую настройку.
Шаг 4. Задайте размер под то место, где эффект увидят
Превью на телефоне читают при ширине примерно в триста пикселей. Тонкие контуры и небольшие выдавливания на таком размере пропадают, поэтому проверьте эффект мелким, прежде чем решить, что он работает.
Шаг 5. Скачайте нужный файл
PNG для веба. Прозрачный PNG, если слово ляжет на вашу собственную картинку, и именно этот вариант большинство упускает.
Каждый стиль на этой странице бесплатен и не требует аккаунта. Откройте TextStudio и впишите своё слово в любой из них.
Весь алфавит в одном эффекте
Некоторым задачам нужны буквы, а не слова: имя, выложенное на стене, топпер для торта, вырезаемый по одной букве, оформление класса. Любой стиль отрисовывает весь алфавит за один раз.
Следите за парами, которые соприкасаются, когда у стиля широкий контур. Если две буквы столкнулись, добавьте межбуквенный интервал, а не уменьшайте текст.
Прозрачный PNG
Скачанный эффект обычно приходит с прямоугольником фона. Сам по себе он не мешает. Поверх вашей собственной фотографии это серый прямоугольник посреди снимка.
В панели скачивания фон можно сделать прозрачным перед экспортом. Тогда файл несёт буквы с их свечением, тенью и объёмом, и больше ничего. Он ложится на фото, видео, слайд или дизайн в Canva, и эффект остаётся нетронутым.
Куда эти надписи попадают
Один и тот же эффект ведёт себя по-разному в зависимости от того, на что он ложится, и это стоит увидеть до того, как вы остановитесь на стиле.
На превью видео враг - размер: слово читают мелким, рядом с другими превью, поэтому контраст важнее деталей. На стикере или в печати враг - край: слову нужна кайма, чтобы отделиться от того, на что его наклеили. Прозрачный PNG закрывает оба случая.
Файлы PSD для Photoshop
Если вам нужны слои, а не готовая картинка, TextStudio раздаёт и исходники. Страница бесплатных текстовых эффектов PSD описывает их как изображения текстовых эффектов PSD высокого разрешения для личного и профессионального использования.
Нужно что-то, что открывает PSD: Photoshop или Photopea в браузере, которая бесплатна и читает слои. Пошаговое описание этого пути есть у нас в статье о редактировании текстового эффекта в Photopea.
Слои стоят лишнего шага, когда эффект должен сидеть внутри более крупной композиции или когда клиент через неделю попросит поменять цвет.
Внутри Canva
Все двенадцать стилей с этой страницы обслуживает и приложение текстовых эффектов для Canva, которое помещает тот же движок внутрь редактора Canva. Вы набираете слово там, и эффект возвращается в ваш дизайн без промежуточной загрузки файла.
Исключение составляют фирменные и логотипные стили: Canva не допускает сторонние логотипы внутри своих приложений, поэтому они остаются на сайте и переносятся в виде прозрачного PNG.
Сколько это стоит
Двенадцать стилей выше бесплатны, и отрисовка любого из них ничего не стоит. Премиум существует, и покупает он другое: качество Ultra HD, все форматы скачивания, включая вектор и PSD, эксклюзивные эффекты и шрифты, отсутствие рекламы и отсутствие требования указывать авторство. Цена составляет 9,99 EUR в месяц, 49,99 EUR за год или 129,99 EUR разово, проверено в день написания.
Об этом стоит сказать прямо, потому что большинство сопоставимых инструментов устроены наоборот: платным у них оказывается сам эффект.
Двенадцать эффектов в одной таблице
| Эффект | Из чего сделан | Какой фон нужен | Лучше всего для |
|---|---|---|---|
| 3D | выдавливание и источник света | любой | логотипы, превью |
| Золото | тёплый градиент плюс скос | тёмный и холодный | приглашения, награды |
| Неон | светящаяся обводка, без заливки | тёмный | вывески, посты о вечеринках |
| Огонь | пламя сверху или угли внутри | тёмный | игры, спорт |
| Хром | градиент с линией горизонта | тёмный или однотонный | дипломы, Y2K |
| Блёстки | зерно внутри плюс пыль вокруг | тёмный, только экраны | дни рождения, профили |
| Контур | одна обводка или несколько | пёстрые фото | мемы, стикеры |
| Тень | смещённая фигура, жёсткая или мягкая | плоский цвет | слайды, плакаты |
| Цвет | по тону на букву или градиент | светлый | школьные классы, праздники |
| Граффити | край баллончика, потёки, распыл | стены, тёмный | музыка, стритвир |
| Пузырь | надутая форма, толстый контур | светлый | дети, открытки |
| Ретро | детали одного десятилетия | тёплый, приглушённый | упаковка, плакаты |
Выберите семейство, которое подходит для места, где слово увидят, а затем потратьте время на цвета. Откройте генератор красивого текста и начните с ближайшего стиля, а не с пустого холста.
Частые вопросы
Здесь правда всё бесплатно? Двенадцать стилей отсюда бесплатны, и их отрисовка тоже. Премиум покрывает Ultra HD, дополнительные форматы, эксклюзивные эффекты и снятие требования указывать авторство.
Можно ли использовать текстовый эффект в коммерческих целях? Прочитайте лицензию выбранного стиля, прежде чем что-то с ним продавать. Стиль фирменного логотипа никогда не принадлежит вам настолько, чтобы его лицензировать, каким бы инструментом ни была сделана картинка.
Бывают ли анимированные текстовые эффекты? Да, некоторые. Анимированные стили выгружаются как видео или GIF вместо неподвижной картинки, и это отдельное семейство, не то, что собрано на этой странице.
Какой файл я получу? По умолчанию PNG, с прозрачной версией в панели скачивания, а вектор и PSD доступны на премиум-тарифе.
Нужен ли мне Photoshop? Нет, ни для чего на этой странице. Photoshop важен, только если вам нужны многослойные файлы PSD, да и тогда Photopea открывает их в браузере.
Какой эффект выбрать? Начните с того, где его увидят. Мелко и пёстро означает контур или тень. Темно и крупно означает неон, золото или огонь. Печать означает что угодно, кроме блёсток.