Создание стилей в Figma

   Давайте разберём какие вообще есть стили в Figma?

• Цвет (стиль заливки элементов)
• Эффект (тень, внутренняя тень, размытие и т.д.)
• Текст (разные стили текста)
• Сетка (если это фрейм или Layout grid, то можно добавить сетку)

   Чтобы применить стиль к элементу для начала его нужно создать.

   Как создать стиль в Figma?

   Создаём некий элемент, добавляем ему заливку цветом. Теперь нужно связать этот цвет с каким-то названием стиля цвета.

   Для этого нужно кликнуть на панель "стиля" (пиктограмма с четырьмя точечками) и нажать на "+", потом дать ему название.

   Теперь можно применять данный стиль к любым другим элементам, шейпам, заливке, фрейму, тексту.

   Чтобы изменить цвет стиля или его название, нужно опять зайти на панель стилей и кликнуть на пиктограмму "Edit style".

   Так же можно стили цвета структурировать по папкам, если в панели стилей в названии поставить "/"

   Например: Dark colors/brown

   Будет папка под названием "Dark colors" а в ней будут находиться все соответствующие цвета.

   Если изменить цвет стиля, то он соответственно поменяется во всех элементах где был использован.

   Такая же логика работы и с другими стилями, с теми же эффектами или текстом.

   К одному и тому же элементу мы можем применить несколько стилей.

   Созданные стили можно передавать из одной работы в другую. Для этого нужно перейти в панель слоёв (Assets) и нажать на "книжку"  либо ALT + 3.

   Появится окошко в котором мы видим наши стили, нажимаем "Publish".

   Теперь эти стили нужно вытащить из общей библиотеки, куда они были добавлены.

   Для этого нужно в новой своей работе перейти на вкладку "Assets" ➡️ кликнуть на "книжку" и выбрать тот файл из которого будем подтягивать данные стили (просто включить ползунок).

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

   Отдельно хочется разобрать стили текста.

   Давайте попробуем  создать какой-то стиль текста.

   Выбираем инструмент "Т" (Текст) и создаём текстовый блок на рабочей области. Добавляем ему стиль "+" и название стиля.

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

   Оперировать можно лишь положением текста внутри текстового блока.

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