AI 분석
라이트 모드 UI 예제 갤러리를 사이드바 내비와 썸네일 카드 그리드로 훑는 화면이다.
왼쪽 고정 사이드바에 예제 목록을 알파벳순으로 길게 세우고 오른쪽 넓은 영역에 콘텐츠를 배치한 2단 구조다. 흰 배경과 거의 검정에 가까운 본문 색으로 고대비를 유지하고, 산세리프 굵은 헤드라인과 회색 보조 문구로 위계를 만들며 초록 New 배지와 회색 Soon 배지로 항목 상태를 구분한다. 중앙 히어로 아래에는 3열 썸네일 카드 그리드가 이어지고, 개별 예제 화면은 제목과 한 줄 설명, 뷰포트 전환 아이콘과 코드 보기 버튼을 상단에 모은 뒤 실제 화면을 미리보기 프레임에 띄운다. 카운트다운 랜딩, 이벤트 캘린더와 생성 모달, 칸반 보드, 결제 수단과 주문 요약이 나뉜 체크아웃까지 유형별 화면이 이어져 예제 카탈로그 사이트의 정보 구조와 미리보기 셸 설계를 참고하기에 좋다.
minimal · light-mode · high-contrast
claude-opus-5 · 2026-09-07 06:01 · 신뢰도 0.78