브리의 성장기

[FIGMA] outline stroke :: 선을 면으로 만들기 본문

공부하기/FIGMA

[FIGMA] outline stroke :: 선을 면으로 만들기

브리(BRIE) 2022. 11. 9. 17:14
728x90

 

피그마에는 Outline Stroke 이라는 기능이 있다.

Outline Stroke 은 언제 사용하는걸까?

 

이해가 쉽도록 아래 예제를 만들어보았다.

왼쪽은 Outline Stroke 이 적용되지 않은 도형의 크기를 키웠을때의 모습이고, 오른쪽은 Outline Stroke 이 적용된 도형의 크기를 키웠을때의 모습이다. 차이가 보이나요?

 

 

Stroke 속성을 그대로 살려둔 왼쪽 도형은 크기가 줄어들어도 선 굵기가 일정하게 유지된다.
Outline Stroke 하여 면속성으로 만들어준 오른쪽 도형은 줄어든 크기에 따라 선 굵기의 비율도 함께 줄어든다.
Outline Stroke 는 도형의 선속성을 면속성으로 바꿔주는 기능이다!


아래에서 보다시피 좌측 도형을 클릭하면 Fill 이 하얀색으로 되어 있는 반면

우측 도형을 클릭하면 Fill 이 검정색으로 되어 있다. (선속성이 면속성이 되었기 때문)

 

 

Fill 속성을 확인해보세요

 

만약, 피그마를 이용해 아이콘을 만들었다 하면
아이콘 크기 변경에 따라 선 굵기의 비율도 함께 줄어 들어야하기 때문에 Outline Stroke 속성을 입혀야 할 것 같다.

(일일히 Stroke 의 속성을 변경해도 OK!)

 

Outline Stroke 단축키
- Window : Ctrl + Shift + O
- Mac : Command + Shift + O

 

728x90

'공부하기 > FIGMA' 카테고리의 다른 글

[FIGMA] 피그마 기본기능 :: Component 와 Varients  (0) 2022.11.06
Comments