버튼은 어떤 기능이나 동작을 실행하거나 기능을 사용하기 위한 상태로 변경하는 요소이다. 사용자가 서비스를 이용하는 과정에서 어떤 행동이 중요한지에 따라 관련된 버튼이 다양한 스타일로 표현된다.
버튼 (Button)
1.버튼 (Button)
버튼을 배경과 구분하는 시각적인 수단으로 면 또는 선으로 표현됨2.텍스트 레이블
버튼을 눌렀을 때 실행되는 기능에 대한 설명. 기본적으로 모든 버튼은 텍스트 레이블을 제공해야 하지만 아이콘만으로 표현되는 버튼인 경우에는 텍스트 레이블을 시각적으로 숨긴 상태로 사용할 수 있음3.아이콘(선택)
버튼을 눌렀을 때 실행되는 기능을 텍스트 대신 시각적인 상징으로 표현한 것유형
Button
Type사용자 과업, 플로우의 중요도에 따라 버튼 간 위계를 구분하여 사용한다.
Primary
Secondary
Tertiary
Quaternary
Warning
Size콘텐츠 내에서 적합한 계층을 가진 크기로 사용한다.
Large
Small
State사용자의 상호작용 시 컬러가 변경된다.
Default
Active
Disabled
Icon버튼 내에 시각적인 상징이 필요하다면 사용한다.
가이드