Кнопка подписаться для фотошопа – Кнопки PSD, PSD бесплатные Files +1 000 сек

Содержание

600+ удивительных PSD исходников кнопок и разных UI элементов для веб — дизайнера

Здравствуйте, дорогие читатели блога beloweb.ru. В этот замечательный вечер мне очень хочется представить Вам подборку в которой Вы сможете найти более 600 PSD исходников кнопок, а также нескольких UI элементов, а именно скролинги, поля для поиска, часы, подсказки и ещё множества замечательных, а самое главное совершенно бесплатных вещей для Веб мастеров и дизайнеров.

В принципе всё как обычно: на картинках Вы сможете посмотреть что находится в PSD файле, и если кнопки понравились тогда можно скачать их бесплатно и по прямой ссылке.

Друзья, если Вы пропустили прошлые подборки с кнопками, то вот несколько из них:

Классные PSD исходники кнопок и регуляторов

Не плохой набор переключателей для веб дизайнера.

Скачать исходники

Полосатые кнопки для сайта

Не большой набор разноцветных и полосатых кнопок для Вашего сайта в PSD формате.

Скачать исходники

Большие 3d кнопки для подписки

Замечательные и большие кнопки серого цвета, которые отлично подойдут для подписки Вашего сайта.

Скачать исходники

PSD Кнопки — иконки для тёмных сайтов

Отличные кнопки минималистического стиля для сайтов с тёмным или чёрным дизайном.

Скачать исходники

Отличный PSD набор голубых кнопок

Замечательный архив светло-голубых кнопок, которые подойдут для любого оформления сайта.

Скачать исходники

PSD набор разных кнопок для сайта

Несколько замечательных кнопок для социальных сетей, а так же простых кнопок в тёмном оформлении.

Скачать исходники

PSD исходники клавиатурных кнопок на сайт

Красивые кнопки светлой компьютерной клавиатуры.

Скачать исходники

PSD набор социальных кнопок для сайта

Удивительный набор для Вашего сайта классных кнопок социальных закладок с тёмным оформлением.

Скачать исходники

Исходники кнопок для выпадающего меню

С помощью этих PSD исходников кнопок для сайта можно сделать замечательное выпадающее меню в тёмном стиле.

Скачать исходники

Светлый Ui набор на сайт

Несколько кнопок, звёзд для рейтинга, а также бегунки для скролинга.

Скачать исходники

Металлические кнопки социальных закладок

Не плохой PSD набор кнопок закладок в металлическом цвете.

Скачать исходники

Удивительных набор PSD исходников для дизайнера

Множество отличных кнопок, полей для поиска и ещё нескольких важных и отличных вещей для создания красивого сайта.

Скачать исходники

Красивые 3 кнопки закладок для сайта

Очень красиво нарисованные кнопки социальных закладок для сайта.

Скачать исходники

Красивые кнопки для навигации

Замечательный набор кнопок для навигации в доступных в чёрном и светлом стилях.

Скачать исходники

Кнопки включить и выключить

PSD набор состоящий из 3 красивых тёмных кнопок.

Скачать исходники

4 красивых кнопок

Красивые большие кнопки для сайта в зелёном цвете.

Скачать исходники

Светлый UI набор разных элементов

В этом наборе Вы найдёте множество классных вещей для разработки сайта.

Скачать исходники

Тёмные PSD исходники UI элементов

Несколько кнопок, меток, а также поле для поиска, часы, скролинг в тёмном оформлении и совершенно бесплатно.

Скачать исходники

Красивые кнопки «Подписаться» (Follow)

Чудесные кнопки с помощью которых пользователь может подписаться на Ваши обновления.

Скачать исходники

Очень красивые и светлые кнопки

Замечательный PSD набор светлых кнопок доступных с множеством расцветок.

Скачать исходники

beloweb.ru

кнопка подпишись PNG, векторы, осчс, иконы для свободного скачивания

  • YouTube согласны кнопку вектор баннер, баннер, кнопка, дизайн PNG и PSD

    YouTube согласны кнопку вектор баннер

    2500*2500

  • набор различных веб   кнопка, страницы, кнопка, веб - PNG и PSD

    набор различных веб кнопка

    1200*2500

  • YouTube согласны кнопку, баннер, кнопка, дизайн PNG и PSD

    YouTube согласны кнопку

    2500*2500

  • игры кнопки, игры кнопки, кнопка, икона PNG и PSD

    игры кнопки

    270*98

  • игра онлайн игры кнопки интерфейса взаимодействия, игра, пользовательский интерфейс, дизайн PNG и вектор

    игра онлайн игры кнопки интерфейса взаимодействия

    1200*1200

  • фиолетовый стерео кнопка, фиолетовый, стерео, кнопка PNG и PSD

    фиолетовый стерео кнопка

    539*234

  • социальные медиа кнопку меню

    социальные медиа кнопку меню «

    2000*2000

  • круглую кнопку, круглую кнопку, изысканный кристалл

    круглую кнопку

    591*591

  • социальные медиа кнопку меню вектор, социальный, социальные медиа, средства массовой информации PNG и вектор

    социальные медиа кнопку меню вектор

    4167*4167

  • перекладина стекло текстуры кнопка, кнопка материал, кнопка векторные элементы, стекло текстуры кнопка PNG и вектор

    перекладина стекло текстуры кнопка

    2002*1130

  • желтый кнопка, кнопка, играть, играть PNG и PSD

    желтый кнопка

    1200*1200

  • кнопка воспроизведения, серый, воспроизведение видео, кнопка PNG и PSD

    кнопка воспроизведения

    1200*1200

  • кнопка воспроизведения, играть, кнопка, кристалл кнопка PNG и PSD

    кнопка воспроизведения

    1200*1200

  • Группа игры кнопки, пуск, Статья энергии, опыт газа PNG и PSD

    Группа игры кнопки

    1200*1200

  • круглую кнопку, металлические кнопки, кнопка материал PNG и PSD

    круглую кнопку

    1200*1200

  • небесно   голубой трехмерной текстуры круто кнопка, синий, стерео, кристалл кнопка PNG и вектор

    небесно голубой трехмерной текстуры круто кнопка

    1200*1200

  • стерео кнопка, стерео кнопка, кнопка PNG и вектор

    стерео кнопка

    1200*1200

  • синий веб   кнопка, затенение, кнопка, веб - сайт PNG изображения и клипарт

    синий веб кнопка

    640*320

  • социальные медиа YouTube подпишитесь кнопку, баннер, кнопка, дизайн PNG и PSD

    социальные медиа YouTube подпишитесь кнопку

    1200*1200

  • подпишитесь кнопку на канале YouTube, баннер, кнопка, дизайн PNG и PSD

    подпишитесь кнопку на канале YouTube

    1200*1200

  • пальцы на кнопки hd, рука, Женщины, сенсорный экран PNG и PSD

    пальцы на кнопки hd

    1200*1200

  • творческие YouTube подпишитесь кнопку, баннер, кнопка, дизайн PNG и PSD

    творческие YouTube подпишитесь кнопку

    2500*2500

  • фиолетовый кнопка, фиолетовый, кнопка, ювелирные изделия PNG и PSD

    фиолетовый кнопка

    1200*1200

  • игры кнопки, игра, кнопка, интерфейс PNG и PSD

    игры кнопки

    800*600

  • игры кнопки границы, игра, кнопка, границы PNG и PSD

    игры кнопки границы

    1200*1200

  • YouTube подпишитесь кнопку привлекательной значок, баннер, кнопка, дизайн PNG и PSD

    YouTube подпишитесь кнопку привлекательной значок

    2500*2500

  • muyis легко контролировать кнопку 3, кнопка, кнопки, стекла PNG и PSD

    muyis легко контролировать кнопку 3

    1200*1200

  • привлекательные YouTube подпишитесь значок кнопки, баннер, кнопка, дизайн PNG и PSD

    привлекательные YouTube подпишитесь значок кнопки

    2500*2500

  • игры кнопки интерактивного дизайна пользовательского интерфейса, игра, пользовательский интерфейс, игра PNG и вектор

    игры кнопки интерактивного дизайна пользовательского интерфейса

    969*1009

  • канцелярская кнопка, удобства вставить макулатура, гвоздь, желтый PNG и вектор

    канцелярская кнопка

    1283*1006

  • Социальные кнопки, социальный, кнопка, панель поиска PNG и PSD

    Социальные кнопки

    400*600

  • игра   ui кнопки золотых монет, игра, пользовательский интерфейс, дизайн PNG и вектор

    игра ui кнопки золотых монет

    864*850

  • красный кнопка, кнопка, одежды кнопку, кнопки PNG и PSD

    красный кнопка

    1200*1200

  • ru.pngtree.com

    Кнопки: бесплатные PSD-файлы

    Бесплатные PSD-файлы веб-элементов никогда ни бывают лишними. А особенно это касается различных кнопок и элементов веб-навигации. Сегодня предлагаем вам подборку кнопок. В статье представлена коллекция из 20 сетов бесплатных PSD-файлов различных кнопок для веб-интерфейса сайта. 

     

     

    Button Icons Pack by deleket

    Скачать

    __________________________________________ 

    Button Docks by deviantdark 

    Скачать

    __________________________________________

    Button psds by easydisplayname

    Скачать

    __________________________________________

    Orange Button 

    Скачать

    __________________________________________ 

    Power button 

    __________________________________________ 

    Скачать

    Slick modern buttons PSD

    Скачать

    __________________________________________

    20 Web buttons by Designmoo

    Скачать

    __________________________________________

    Buttons PR PSD

    Скачать

    __________________________________________

    Button by Visionconcept

    Скачать

    __________________________________________

    Semi transparent buttons 

    Скачать

    __________________________________________

    Social net buttons 

    Скачать

    __________________________________________  

    Big social net buttons

     

    Скачать 

    __________________________________________  

    Download buttons PSD pack

     

     Скачать 

    __________________________________________      

    Social buttons PSD

    Скачать 

    __________________________________________

    Classy social media buttons  

     

    Скачать 

    __________________________________________         

    On-Off buttons

     

    Скачать  

    __________________________________________         

    4 Web buttons

    Скачать   

    __________________________________________       

    3D Green Button

     

    Скачать 

    __________________________________________    

    Arrow buttons PSD pack  

    Скачать 

    __________________________________________      

    6 Shiny Buttons 

    Скачать 

    __________________________________________      

    Автор: Дежурка

     

     

    

    Комментарии

    Оставить ответ

    Похожие статьи

    Случайные статьи

    www.dejurka.ru

    35 красивых и бесплатных PSD кнопок для Вашего сайта

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

    Также рекомендую посмотреть прошлые подборки:

    • Бесплатные анимированные кнопки для сайта с использованием CSS3
    • 40 бесплатных PSD кнопок и иконок для Twitter на сайт
    • Photoshop PSD исходники кнопок и иконок для сайта

    Скачать

    Скачать

    Скачать

    Скачать

    Скачать

    Скачать

    Скачать

    Скачать

    Скачать

    Скачать

    Скачать

    Скачать

    Скачать

    Скачать

    Скачать

    Скачать

    Скачать

    Скачать

    Скачать

    Скачать

    Скачать

    Скачать

    Скачать

    Скачать

    Скачать

    Скачать

    Скачать

    Скачать

    Скачать

    Скачать

    Скачать

    Скачать

    Скачать

    Скачать

    Скачать

    Спасибо сайту www.2expertsdesign.com

    beloweb.ru

    Создаём в Фотошоп набор кнопок для социальных сетей / Фотошоп-мастер

    В этом уроке мы нарисуем кнопки для социальных сервисов при помощи векторных объектов и стилей слоя.

    Скачать материалы к уроку

    Конечный результат:

    Шаг 1

    Создайте новый документ в Фотошопе (Ctrl + N) с параметрами, показанными на скриншоте ниже. Включите сетку через меню Просмотр > Показать > Сетка (View > Show > Grid) и привязку к ней (Просмотр > Привязка к > Сетка) (View > Snap To > Grid). Для начала нам нужна сетка с шагом в 5 пикселей. Перейдите в меню Редактирование > Установки > Направляющие, сетки и фрагменты (Edit > Preferences > Guides, Grid & Slices). В поле Линия через каждые (Gridline Every) введите значение 5 пикселей, а в поле Внутреннее деление на (Subdivision) – цифру 1. Цвет сетки — #828282. Чтобы быстро включить и выключить сетку, используйте сочетание клавиш Ctrl + “.

    Вам также понадобится панель Инфо (Окно > Инфо) (Window > Info).

    Шаг 2

    На панели инструментов установите цвет #426DAC. Выберите инструмент Прямоугольник со скругленными углами и на верхней панели задайте радиус 25 пикселей. Создайте фигуру 150х50 пикселей.

    Шаг 3

    Загрузите набор узоров «Dark Gray Flecks» и примените стиль Наложение узора (Pattern Overlay):

    Обводка (Stroke): Положение – Снаружи, Режим – Нормальный, Тип обводки – Цвет, Цвет — #002469.

    Внутренняя тень (Inner Shadow): Режим – Мягкий свет, Цвет – белый.

    Внутреннее свечение (Inner Glow): Режим – Мягкий свет, Цвет – чёрный.

    Наложение градиента (Gradient Overlay): Режим – Перекрытие, Стиль – Линейный, Градиент – от чёрного к белому.

    Наложение узора (Pattern Overlay): Режим – Мягкий свет.

    Шаг 4

    Создайте копию слоя с фигурой (Ctrl + J), кликните на ней правой кнопкой мыши и выберите пункт Очистить стиль слоя (Clear Layer Style). Уменьшите заливку копии до 0% и примените стиль Наложение градиента (Gradient Overlay): Режим – Мягкий свет, Стиль – Линейный.

    Шаг 5

    Создайте копию слоя, на котором только что работали (Ctrl + J). Удалите стили с неё и уменьшите заливку до 0%. Примените стиль Наложение градиента.

    Шаг 6

    Уменьшите расстояние между линиями сетки до 1 пикселя. Создайте прямоугольник со скругленными углами цветом #234474 с радиусом 2 пикселя. Размер фигуры – 64х34 пикселя.

    Шаг 7

    Примените следующие стили:

    Внутренняя тень (Inner Shadow): Режим – Мягкий свет.

    Внутреннее сечение (Inner Glow): Режим – Мягкий свет, Метод – Мягкий.

    Наложение градиента (Gradient Overlay): Режим – Мягкий свет, Стиль – Линейный, Градиент — #ffffff — #c0c0c0 —  #ffffff.

    Отбрасывание тени (Drop Shadow): Режим – Перекрытие.

    Шаг 8

    Создайте белый скругленный прямоугольник с радиусом 2 пикселя размером 54х26 пикселей. Расположите его внутри предыдущего прямоугольника.

    Шаг 9

    Выберите инструмент Добавить опорную точку (Add Anchor Point) и добавьте две якорные точки на середины боковых сторон. Затем выберите инструмент Стрелка (Direct Selection Tool), выделите одну среднюю точку на правой стороне и сдвиньте её вправо на 1 пиксель. Сделайте аналогичное для левой якорной точки.

    Шаг 10

    К белой фигуре примените следующие стили:

    Наложение градиента (Gradient Overlay): #484848 — #f7f7f7 — #484848.

    Внешнее свечение (Outer Glow): Режим – Мягкий свет.

    Отбрасывание тени (Drop Shadow):

    Шаг 11

    Из набора иконок возьмите иконку Facebook и вставьте букву f в наш документ поверх светлой области.

    Шаг 12

    Инструментом Эллипс (Ellipse Tool) (U) создайте чёрный круг диаметром 7 пикселей. Создайте две копии круга и расположите их, как показано на скриншотах.

    Шаг 13

    Выберите инструмент Линия (Line Tool) (U) и задайте толщину в 2 пикселя. Соедините середины чёрных кругов линией. Все круги и линии объедините в один слой (Ctrl + E).

    Шаг 14

    Уменьшите заливку слоя до 5% и примените стили, показанные ниже.

    Внутренняя тень (Inner Shadow): Режим – Мягкий свет.

    Внутреннее свечение (Inner Glow): Режим – Мягкий свет.

    Внешнее свечение (Outer Glow): Режим – Мягкий свет, Метод – Мягкий.

    Отбрасывание тени (Drop Shadow): Режим – Мягкий свет.

    Шаг 15

    Создайте чёрный скругленный прямоугольник размером 130х20 пикселей с радиусом 10 пикселей. Расположите его поверх нашей иконки.

    Шаг 16

    Преобразуйте чёрную фигуру в смарт-объект и примените фильтр Размытие по Гауссу (Фильтр > Размытие > Размытие по Гауссу) (Filter > Blur > Gaussian Blur) со значением 10 пикселей. Уменьшите заливку слоя до 40% и отправьте его на задний план (Ctrl + Shift + [).

    Шаг 17

    Чтобы создать другие кнопки социальных сервисов, нужно просто продублировать слои и изменить цвет. На скриншоте ниже показано, как нужно изменить цвет, обводку и рамку, созданные на шагах 2, 3 и 6.

    Конечный результат:

    Скачать материалы к уроку

    Автор: Razvan Gabriel

    Перевод: Stark

    photoshop-master.ru

    Рисуем кнопки для веб-сайта в Фотошоп / Фотошоп-мастер

    Содержание
    • #Шаг 1
    • #Шаг 2
    • #Шаг 3
    • #Шаг 4
    • #Шаг 5
    • #Шаг 6
    • #Шаг 7
    • #Шаг 8
    • #Шаг 9
    • #Шаг 10
    • #Шаг 11
    • #  Вопросы и комментарии

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

    Финальное изображение:

    Шаг 1

    Создайте новый документ (Ctrl + N) размером 1280 x 1024 пикселов.

    Шаг 2

    Залейте фон цветом #СCCBCC и кистью (Brush Tool) (В) большого размера белого цвета кликните один раз в центре фона, чтобы создать световое пятно. Теперь фон похож на радиальный градиент.03

    Шаг 3

    Инструментом Прямоугольник со скругленными углами ( Rounded Rectangle Tool) (U) нарисуйте фигуру с радиусом скругления 180 пикселов:

    Шаг 4

    К фигуре примените стиль слоя Наложение градиента (Gradient Overlay). Используйте параметры, которые показаны на скриншоте:

    Шаг 5

    Инструментом Овальная область выделения (Elliptical Marquee tool) (M) нарисуйте круглое выделение и залейте его черным цветом. Расположите его на предыдущей фигуре:

    Шаг 6

    Скопируйте стили со слоя с прямоугольной фигуры (кликните правой кнопкой мыши в палитре Слои по стилям слоя и выберите пункт Скопировать стили слоя. Теперь перейдите на слой с черным кругом, кликните по нему в палитре Слои правой кнопкой мыши и выберите пункт Вклеить стили слоя).

    Шаг 7

    Также, к слою с кругом примените стиль Тень (Drop shadow):

    Шаг 8

    Инструментом Овальная область выделения (Elliptical Marquee tool) (M) нарисуйте круглое выделение и залейте его белым цветом.

    Шаг 9

    Выберите инструмент Произвольная фигура (CustomShapeTool) и нарисуйте фигуру конверта в режиме слой-фигуры.

    Шаг 10

    На слой с конвертом вклейте те стили слоя, которые ранее копировали:

    Шаг 11

    При помощи инструмента Текст (Text Type Tool) (T) напишите текст на кнопке:

    Финальное изображение:

    Автор: webdesign

    photoshop-master.ru

    Рисуем кнопку-переключатель в Adobe Photoshop

    Если вы решили самостоятельно нарисовать элементы пользовательского интерфейса для вашего сайта, этот урок поможет вам начать. Сегодня мы будем рисовать несложную кнопку-переключатель. Однако несмотря на всю простоту урока, полезен он тем, что дает представление о том, как передать углубления и объем кнопок для UI. Также урок будет интересен тем, кто еще не пробовал рисовать векторные изображения в Adobe Photoshop.

     


    Шаг 1

    Откройте Photoshop и нажмите Control + N, чтобы создать новый документ. Введите данные, которые видите на картинке ниже.

    Включите сетку (View > Show > Grid) и привязку с сетке (View > Snap To > Grid). Для начала нам понадобится расстояние между линиями сетки в 5px. Зайдите в Edit > Preferences > Guides, Grid & Slices и обратите внимание на раздел Grid. Укажите 5 в поле Gridline Every и 1 в поле Subdivision. Также смените цвет сетки на #a7a7a7. После того как вы закончили с настройками нажмите OK. Не пугайтесь вида этой сетки. Она упростит вашу работу.

    Откройте палитру Info (Window > Info), чтобы следить за размером и расположением вашей работы.

    Шаг 2

    Выберите в качестве первого цвета #e8d8a7, возьмите инструмент Rounded Rectangle Tool и обратите внимание на меню настроек вверху экрана. Укажите радиус в 30px, создайте векторную фигуру размером 190 на 60px и убедитесь что она осталась выделенной.

    Продолжаем работать с Rounded Rectangle Tool. Снова обращаемся к верхнему меню настроек и выбираем кнопку Add. Добавьте еще одну векторную фигуру размером 20 на 10px и разместите ее как показано на второй картинке. Привязка к сетке вам поможет.

    Убедитесь что ваша фигура все еще выделена, и все тем же инструментом Rounded Rectangle Tool нарисуйте вторую векторную фигуру (как на третьей картинке).

    Шаг 3

    Посмотрите на палитру Layers (Window > Layers). Двойным кликом на слое с фигурой, которую мы только что нарисовали откройте окно Layer Style. Поставьте галочку напротив Drop Shadow, Inner Shadow, Outer Glow, Bevel and Emboss и Gradient Overlay, затем введите параметры, указанные на картинках ниже.






    Шаг 4

    Выберите в качестве первого цвета #a29261 и возьмите инструмент Rounded Rectangle Tool. Нарисуйте фигуру размером 180 на 50px, расположите ее как на картинке ниже и убедитесь что она все еще выделена. Убедитесь, что выбранный инструмент — Rounded Rectangle Tool, и в верхнем меню настроек нажмите на кнопку Subtract.

    Нарисуйте фигуру размером 170 на 40px и расположите ее так, как показано на картинке ниже. Откройте окно Layers Style нового векторного слоя и введите параметры, которые вы видите на картинке ниже.


    Шаг 5

    Укажите в качестве первого цвета #d4c493 и выберите инструмент Rounded Rectangle Tool. Создайте фигуру размером 170 на 40px и разместите как показано на картинке ниже. Откройте окно Layers Style для этого слоя и введите указанные ниже параметры.

    Вернитесь в палитру Layers и переименуйте этот слой в «interior».




    Шаг 6

    Для выполнения следующего шага нам понадобится расстояние между линиями сетки в 1px. Зайдите в меню в Edit > Preferences > Guides, Grid & Slices и введите 1 в поле Gridline Every. Выберите в качестве первого цвета #ac9c6b, возьмите инструмент Ellipse Tool, создайте круг размером в 4px и поместите так, как показано на картинке ниже.

    Откройте окно Layers Style для этого слоя и введите параметры, что указаны ниже.



    Шаг 7

    Дублируйте фигуру, которую нарисовали в предыдущем шаге (CTRL + J). Выделите эту копию и перетащите ее вправо, как показано ниже.

    Шаг 8

    Укажите в качестве первого цвета #a29261 и возьмите Rounded Rectangle Tool. Нарисуйте фигуру размером 100 на 44px и разместите как показано ниже.

    В окне Layers Style для этого слоя введите указанные параметры.





    Шаг 9

    Дублируйте фигуру из предыдущего шага (CTRL + J). В панели Layers кликните правой кнопкой на только что сделанную копию слоя и выберите Clear Layer Style.

    Также для этого слоя снизьте параметр Fill до 0%, затем откройте Layer Style и введите указанные ниже параметры.



    Шаг 10

    Снова дублируйте фигуру из предыдущего шага (CTRL + J). В панели Layers кликните правой кнопкой по этой копии и выберите Сlear Layer Style.

    Далее работаем с палитрой Layers. Удерживая CTRL нажмите на слой «interior». Должно появиться выделение по форме этой фигуры. Убедитесь что это случилось, затем выберите слой, который создали в начале этого шага и нажмите кнопку «Add layer mask».

    После применения маски ваша работа должна выглядеть как на третьей картинке ниже. Нажмите Control + D чтобы снять выделение.

    Шаг 11

    Снова задайте выделение фигуре, к которой применили маску, снизьте параметр Fill до 0%, затем откройте окно Layer Style. Поставьте галочку напротив «Layer Mask Hides Effects», после чего активируйте Drop Shadow и введите параметры как на картинке ниже.



    Шаг 12

    Выберите в качестве первого цвета #85bc46, возьмите Rounded Rectangle Tool, создайте фигуру размером 5 на 14px и убедитесь что она осталась выделена. В верхнем меню настроек нажмите кнопку Add, и нарисуйте еще две фигуры размером 5 на 14px, как показано на картинке ниже.

    Шаг 13

    Выделите фигуры, которые нарисовали в предыдущем шаге и разместите как показано ниже. Откройте Layer Style для этого слоя и введите параметры, показанные на картинке ниже.






    Шаг 14

    Возьмите инструмент Type Tool (T) и просто напишите «ON», как показано на первой картинке ниже. Можете использовать жирный шрифт Latha, размером в 15pt и цвета #b6a675. Откройте Layers Style для слоя с текстом и введите значения из рисунков ниже.



    Шаг 15

    Зайдите в палитру Layers. Выделите слой с текстом, а также все слои с векторными фигурами, которые создавали до сих пор. После чего нажмите правой кнопкой мыши на любом из выделенных слоев и выберите Duplicate Layers. Выделите все сделанные копии и перетяните их немного вниз, как на картинке ниже. Вернитесь к палитре Layers и обратите внимание на сделанные копии слоев.

    Выделите четыре слоя фигур, которые составляют округлую кнопку, удерживая Shift переместите их на 74px правее. В итоге работа должна выглядеть как на второй картинке ниже.

    Шаг 16

    Выделите текст, перепишите «ON» на «OFF» и разместите как на картинке ниже. Выберите слой с фигурой, к которой применяли маску и в меню выберите Edit > Transform > Flip Horizontal. После чего откройте Layer Style и просто инвертируйте угол указанный в закладке Drop Shadow.


    Шаг 17

    Теперь работаем с зелеными фигурами. Выделите их в палитре Layer, откройте Layer Style и измените параметры на те, что указаны ниже.




    Работа сделана!

    Вот как выглядит финальный вариант:

    Автор урока Andrei Marius

    Перевод — Дежурка

    Читайте также:

    www.dejurka.ru

    Добавить комментарий

    Ваш адрес email не будет опубликован. Обязательные поля помечены *

    Авторское право © 2021 Es picture - Картинки
    top