Найти в Дзене
Flipio Studio

Как сделать эффект матового стекла в Figma.

Многие не раз видели на стоках, социальных сетях и элементах сайта, тренд эффекта матового стекла, его еще называют Glassmorphism или на русском - Стекломорфизм. В сегодняшней статье вы научитесь создавать такие элементы сами. Статья состоит из некого количества картинок, дабы вам было более понятно и интересно. Все необходимые HEX коды цвета будут предоставлены Шаг 1. Подробнее о Corner Smoothing Шаг 2. Для необходимого эффекта размытия заднего фона, добавляем Background Blur, выставляем значение 25% Шаг 2. В настройках слоя, добавляем stroke и выставляем значения как показано на картинке. Должны получить вот такой эффект Готово! Если у вас возникли вопросы и необходима помощь, пишите в комментарии, я с удовольствием вам помогу.
Оглавление

Многие не раз видели на стоках, социальных сетях и элементах сайта, тренд эффекта матового стекла, его еще называют Glassmorphism или на русском - Стекломорфизм.

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

Все необходимые HEX коды цвета будут предоставлены

Шаг 1.

#c4c4c4
#c4c4c4

Подробнее о Corner Smoothing

-3

Шаг 2.

-4
Для необходимого эффекта размытия заднего фона, добавляем Background Blur, выставляем значение 25%

Шаг 2.

-5
В настройках слоя, добавляем stroke и выставляем значения как показано на картинке.

-6
Должны получить вот такой эффект

Готово!

-7

Если у вас возникли вопросы и необходима помощь, пишите в комментарии, я с удовольствием вам помогу.