Поясняю за кнопку

Привет! Чтобы добавить в копилку скилов манипуляции со слоями в Figma, покажу, как можно сделать светящуюся кнопку со свечением маски в зависимости от внутренних объектов

Сначала нужно создать два объекта

Упакуйте объекты в маску кнопкой сверху экрана Figma, либо сочетанием «ctrl+alt+M». После того, как создали маску, добавьте внутрь нее еще один прямоугольник, чтобы маска не была прозрачной

Задайте эллипсу Эффект layer blur. Отодвиньте его к краю, чтобы половина эллипса выходила за маску.

Выделите в слоях объект «Маска». Задайте ей эффект Drop Shadows с достаточной интенсивностью blur (примерно 50). У вас получится эффект такой, что бледное свечение эллипса виднор за пределами маски

Теперь вы знаете принцип затухающего свечения за пределами маски. Отлично, теперь давайте создадим кнопку с таким эффектом.

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

Теперь, так же, как я показывал выше, упаковываем объекты в маску

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

Прямоугольнику задаем стиль:

- Fill #$$$$$$ 1% (Любой цвет)

- Inner Shadow Blur 6 (по центру)

Также подкрашиваем наши эллипсы и задаем им эффект layer blur, и получаем такую кнопку

У самого слоя маски вы можете добавить 1 или 2 Drop Shadow, настройка по усмотрению, но я использую два слоя с blur со значением 8 и 3 (по центру).

Результат: У нас получилась святящаяся кнопка, у которой внутренние эффекты подсвечиваются снаружи, как бы создавая затухающее свечение.

Спасибо за то, что дочитали до конца, а еще лучше — проделали ради фана это всё в фигме!) Также можно настроить анимацию движения эллипсов при наведении, но это, если захотите, в другой серии. :)