사용자가 동작을 취하도록 돕는 버튼 EX) 이메일 전송, 문서 공유, 댓글 좋아요
화면 중 가장 중요한 동작을 나타내는 버튼
사용자가 주요 동작을 취할 수 있도록 돕는 버튼으로 텍스트 라벨과 넓은 너비로 FAB보다 충분한 touch target을 제공
사용자가 한 번의 탭으로 보조적인 동작을 취할 수 있도록 돕는 버튼
사용자가 옵션 선택, 뷰 전환, 요소 정렬 등의 동작을 취하도록 돕는 버튼
라벨과 숫자를 포함하여 갯수나 상태 등의 동적 정보 전달하는 컴포넌트
사용자에게 진행 중인 프로세스들의 상태를 알리는 컴포넌트 EX) 앱 로딩 중, 폼 제출 중
화면 하단에 앱의 프로세스와 관련된 간단한 메시지 제공하는 컴포넌트
화면 하단에 고정되어 보충적인 내용을 나타내는 컴포넌트
하나의 객체 대한 내용과 동작을 포함하는 카드
화면 안팎으로 스크롤이 가능한 아이템들을 포함하는 컴포넌트
▶️
유저 플로우에 중요한 프롬프트 제공하는 컴포넌트
리스트 또는 컨테이너의 내용을 그룹화하는 얇은 선
연속적이며 세로로 표시되는 텍스트 또는 이미지 목록
일종의 작업을 지원하기 위해 보조적인 내용 및 동작을 포함하는 화면
상황에 따라 유익하고 구체적이며 동작 기반의 정보를 지원하는 텍스트 라벨
화면 하단의 네비게이션과 주요 동작들을 나타내는 컴포넌트
앱의 주요 Destination 간의 지속적이고 편리한 전환 제공하는 컴포넌트
앱의 Destination에 대해 인체공학적으로 접근할 수 있도록 제공하는 컴포넌트
테블릿 또는 데스크탑 화면에서 앱의 주요 Destination에 접근할 수 있도록 제공하는 컴포넌트
단어 또는 문구를 입력하고 관련 정보를 얻을 수 있도록 하는 컴포넌트로 다른 형태로 된 네비게이션의 대안
다른 화면과 데이터 집합, 상호작용 간의 내용 정리하는 컴포넌트
화면 상단에 정보와 동작을 나타내는 컴포넌트
사용자가 집합 중 하나 이상의 항목을 선택할 수 있으며, 옵션을 활성화 또는 비활성화가 가능한 컴포넌트
→ Unselected, selected(hover), and indeterminate
사용자가 정보를 입력하거나 선택하고, 내용을 필터링 하고, 동작을 트리거하도록 돕는 컴포넌트
사용자가 날짜 또는 날짜 범위를 선택하는 컴포넌트
일시적으로 선택 목록을 표시하는 컴포넌트
사용자가 집합에서 하나의 옵션을 선택할 수 있도록 하는 버튼
값의 범위에 대해 사용자가 선택을 할 수 있도록 하는 컴포넌트
단일 아이템 상태를 활성화 또는 비활성화로 전환할 수 있는 컴포넌트
사용자가 특정 시간을 선택하거나 설정하도록 돕는 컴포넌트
사용자가 UI에 텍스트를 입력할 수 있도록 하는 컴포넌트로, 주로 폼이나 다이얼로그 형태로 나타남
