Accessibility Pattern Hub
WCAG 2.1 AA 기준의 공통 베이스라인과 다양한 디자인 시스템들의 구현 방식을 한눈에 비교하세요.
21
Patterns
6
Design Systems
93
Must Rules
59
Should Rules
모든 패턴
Accordion
섹션별로 콘텐츠를 접고 펼칠 수 있는 패턴
4 must3 should
Alert / Toast
사용자 작업을 방해하지 않고 중요 메시지를 전달하는 알림 컴포넌트
4 must3 should
Breadcrumb
현재 페이지의 계층적 위치를 나타내는 탐색 경로 컴포넌트
3 must2 should
Button
사용자가 액션을 트리거하는 기본 인터랙티브 요소
5 must3 should
Checkbox
항목을 선택하거나 해제할 수 있는 체크박스 패턴
4 must3 should
Combobox
텍스트 입력과 선택 목록이 결합된 자동완성 패턴
6 must3 should
Date Picker
캘린더 UI로 날짜를 선택하는 입력 컴포넌트
5 must3 should
Disclosure
버튼 클릭으로 콘텐츠를 표시하거나 숨기는 패턴
3 must3 should
Drawer
화면 가장자리에서 슬라이드하여 나타나는 사이드 패널 컴포넌트
5 must2 should
Form Validation
인라인 에러 메시지와 접근 가능한 유효성 검사를 포함한 폼 컴포넌트
5 must3 should
Link
다른 페이지나 리소스로 이동하는 하이퍼링크 패턴
4 must3 should
Modal Dialog
현재 작업을 중단하고 사용자의 주의를 요구하는 오버레이 컴포넌트
6 must3 should
Navigation Menu
드롭다운 하위 메뉴를 포함하는 사이트 내비게이션 컴포넌트
4 must3 should
Pagination
여러 페이지의 콘텐츠를 탐색하는 페이지 번호 컴포넌트
4 must2 should
Popover
버튼으로 트리거하는 대화형 플로팅 패널 컴포넌트
4 must3 should
Radio Group
여러 옵션 중 하나를 선택하는 라디오 버튼 그룹
5 must2 should
Select (Listbox)
목록에서 하나의 옵션을 선택하는 커스텀 드롭다운 컴포넌트
5 must3 should
Tabs
콘텐츠 영역을 탭으로 구분하여 전환하는 패턴
6 must3 should
Text Input
사용자가 텍스트를 입력하는 폼 컨트롤
4 must3 should
Toggle / Switch
두 가지 상태(on/off) 사이를 전환하는 컨트롤
4 must2 should
Tooltip
요소에 추가 설명을 제공하는 팝업 텍스트 패턴
3 must4 should
Design Systems
Material (MUI)
Radix UI
Ant Design
Chakra UI
React Spectrum
Base UI