Как сделать обводку в Фигме. Сплошную или пунктирную.

Как создать пунктирную или сплошную обводку в Figma? Инструкция для начинающих пользователей программы.

Инструкция как сделать сплошную или пунктирную обводку вокруг фигуры, фрейма, текста или любого другого объекта в Фигме.

Чтобы сделать обводку в Figma нужно:

1. Выбрать какой-либо элемент. Это может быть фигура, текст, фрейм или что-то ещё.
2. В правой панели напротив надписи «Stroke» нажмите иконку плюсика.

1. После этого вы сможете изменять цвет обводки, задавать толщину, делать обводку пунктиром.

Как сделать пунктирную обводку в Фигме?

Пунктирную обводку можно создать после добавления обычной. Нажмите внизу надписи «Stroke» (в правой панели) на иконку с тремя точками. Перед вами появится окно с заголовком «Advanced stroke». Это расширенные настройки обводки. Измените значение параметра «Dashes». Например можно поставить 50, 40. Первая цифра (50) — это размер пунктирных линий. Вторая цифра (40) — размер разрыва между пунктирными линиями.

Параметры обводки в Figma

Рассмотрим основные параметры обводки, которые вы можете изменять.
Такие как: цвет, прозрачность, видимость, удаление, толщина обводки, тип, преобразование сплошной линии обводки в пунктирную.

1. Цвет

Чтобы изменить цвет обводки нажмите на цвет внизу надписи «Stroke» или введите код какого-либо цвета (например FF2A54).

Также вы можете изменять тип обводки. Если откроете панель цвета, то сверху по умолчанию стоит надпись «Solid» — это сплошная обводка. В списке есть другие типы обводки.
Linear — линейный градиент.
Radial — радиальный градиент.
Angular — угловой градиент.
Diamond — градиент в виде кристала.
Image — изображение.

2. Добавление нового стиля цвета

Напротив надписи «Stroke» есть иконка с 4 точками в виде квадрата. Если на неё нажать, то появится возможность выбирать цвет из цветовой палитры. Если вы хотите создать новый цвет в вашей палитре и использовать его повторно, то нажмите на плюсик (как показано на картинке выше).

Дайте имя новому цвету и нажмите на кнопку «Create style». После этого вы сможете исползовать этот цвет повторно и он появится в панели справа.

3.Видимость

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

4. Как сделать обводку в фигме более прозрачной

Чтобы изменить прозрачность обводки, измените цифры с процентами. Изначально по умолчанию стоит 100%. Если поставить 50%, то прозрачность измениться.

5. Как удалить обводку в фигме

Чтобы удалить обводку в фигме, нажмите на иконку минуса.

6. Толщина.

Изменение толщины обводки интуитивно понятно. Для того, чтобы это сделать нужно изменить цифру под цветом, напротив иконки с 3 линиями разной толщины. Изначально создается обводка толщиной 1 px.

7. Выбор типа обводки

Можно сделать обводку внутри (Inside), по центру (Center), снаружи (Outside).