피그마 ui 디자인을 할 때 정말 많이 써먹는 컴포넌트 프로퍼티에 대해서 정리!!
일단 호버 상태나 프레스 상태 등에 따라서 텍스트 색상이나 버튼 색상이 바뀌는데, 이걸 디자인할 때 컴포넌트 프로퍼티 기능을 쓴다.
프로퍼티와 유사 기능으로 배리언츠가 있다.(곡률, 크기 등 파운데이션이 바뀌면 배리언츠이다)
아무튼 프로퍼티에는 세가지 기능이 있다
1) 👁️ Boolean -> y/n로 껐다켜기
2) ◇ Instance swap -> 인스턴스를 다른 인스턴스로 교체(예를 들면 다른 아이콘같은걸로)
3) 𝐓 Text -> 컴포넌트 안에 있는 텍스트를 컴포넌트 속성으로 만듦 (패널에서 텍스트 수정)
일반적인 버튼은 프라이머리(Primary, 1순위), 세컨더리(Secondary, 2순위), 터시어리(Tertiary, 3순위)의 3단계
네이밍도 이렇게 지어주면된다
large랑 small따라 만들고 pressed 실습까지 끝...~~
'내배캠 TIL' 카테고리의 다른 글
| Containment 요소 정리, 오토레이아웃 실습 (TIL 2일차) (3) | 2025.12.30 |
|---|---|
| 본캠프 TIL 1일차 정리 (Button,FAB,Snackbar) (2) | 2025.12.29 |
| 피그마 리사이징 기능/컬러 스타일 익히기(TIL 3일차) (1) | 2025.12.24 |
| 피그마 기초 지식 정리 (TIL 2일차) (0) | 2025.12.23 |
| 스파르타 부트캠프 시작!! (TIL 1일차) (1) | 2025.12.22 |