Конечно! Давай разберем пошагово, как в Figma можно обрезать картинку по фигуре. Такой процесс называется маскированием (masking).
🔷 Шаг 1: Подготовь элементы
Загрузите в Figma или вставьте изображение, которое хотите обрезать.
Создайте фигуру (например, круг, прямоугольник, звезду и т.д.), по которой нужно обрезать изображение.
🔷 Шаг 2: Размести фигуру и изображение
Убедись, что фигура находится над изображением в панели слоев (Layers).
Если нужно, перетащи слой фигуры выше слоя изображения.
Размести фигуру так, чтобы она накладывалась на ту часть изображения, которую нужно оставить.
🔷 Шаг 3: Применяй маску
Выдели оба слоя — и фигуру, и изображение.
Это можно сделать, удерживая
Shift
и кликая по слоям в панели Layers или на холсте.
Нажми правой кнопкой мыши и выбери «Use as Mask» (Использовать как маску).
Либо используй сочетание клавиш: Ctrl + Alt + M (Windows) или Cmd + Option + M (Mac).
🔷 Что происходит?
Фигура становится маской: видимой останется только та часть изображения, которая находится под фигурой.
В панели слоев появится группа «Mask Group».
🔷 Настройка маски
Чтобы переместить маску или изображение внутри маски, дважды кликни на нужный элемент в группе (или раскрой Mask Group в панели Layers) и перемести его.
Можно редактировать маску, меняя форму фигуры.
🔷 Примеры использования
✅ Круглая аватарка
Нарисуй круг, размести его поверх фотографии и сделай маску.
✅ Необычные формы
Используй любые фигуры (многоугольники, звезды, произвольные кривые) для создания оригинальных вырезов.
🔷 Советы и нюансы
🔹 Стилизация:
Применяй эффекты, заливки и обводки не к маске, а к группе Mask Group или к самой фигуре (если нужно).
Можно использовать несколько фигур (объединенных в один фрейм), чтобы маскировать сложные формы.
🔹 Удаление маски:
Если маска больше не нужна, раскрой группу, выбери маску и нажми правой кнопкой — выбери «Remove mask» (Удалить маску).
🔹 Комбинирование:
Можно сделать несколько масок, если нужно обрезать изображение разными способами.
🔷 Кратко — “формула” маски:
1. Фигура (на верхнем слое)
2. Изображение (ниже)
3. Выделяешь оба
4. Используешь “Use as Mask” (Ctrl/Cmd + Alt/Option + M)
💡 Если нужно, могу сделать скриншоты или GIF-инструкцию для визуализации!
Будут ли еще вопросы? 😊