컴포넌트 전체 보기

입력에 맞춰 나타나는 추천 목록

저장·제출 등의 동작 실행

연관된 버튼을 하나의 묶음으로

여러 항목을 동시에 선택

파일을 끌어 놓거나 찾아서 업로드

한 줄 텍스트 입력

숫자 입력과 값 증감

입력 항목의 이름과 필수 표시

여러 항목 중 하나만 선택

정해진 옵션 목록에서 선택

핸들을 움직여 값 조절

설정을 켜고 끄기

여러 줄의 긴 내용 입력

계층형 목록에서 항목 선택

색상과 명도·채도 선택

날짜·시간과 기간 선택

현재 위치와 상위 경로 표시

로고와 주요 탐색을 담는 상단 바

그룹과 하위 항목이 있는 사이드 메뉴

페이지 번호로 목록 이동

단계별 작업의 진행 위치

한 영역 안의 화면 전환

사용자 이미지와 이니셜

아이콘 위의 개수와 상태 표시

표지·본문·동작을 담는 콘텐츠 카드

구문 강조와 줄 번호로 코드 읽기

제목을 눌러 콘텐츠 펼치기

동작과 의미를 전달하는 픽토그램

문서 페이지 탐색과 확대·축소

작은 영역에 담는 데이터 추이

행과 열로 정리한 데이터

항목을 분류하는 텍스트 꼬리표

폴더와 항목의 계층 구조

화면 상단에 고정하는 주요 알림

완료 비율을 원형으로 표시

표시할 데이터가 없는 상태 안내

해당 입력·동작 옆의 피드백

작업 완료 비율을 막대로 표시

로딩 중인 콘텐츠의 자리 표시

완료 비율을 모르는 작업의 로딩

작업 결과를 잠시 띄우는 알림

화면 가장자리에서 열리는 패널

트리거 버튼 아래로 펼치는 동작 목록

그룹과 중첩 메뉴로 구성한 명령 목록

배경을 가리고 응답을 받는 대화상자

배경을 유지하며 이동·크기 조절하는 창

동작 직전에 확인·취소를 묻는 팝업

트리거 옆에 풍부한 추가 정보 표시

마우스를 올렸을 때 짧은 설명 표시

콘텐츠 사이의 수평·수직 구분선

방향·간격·정렬로 요소 배치

헤더·사이드바·본문·푸터 구성

구분선을 드래그해 패널 크기 조절