AI 분석
확장형부터 아이콘 레일까지 SaaS 사이드바 축소 단계를 나란히 보여주는 컴포넌트 시안이다.
밝은 회색 배경 위에 흰색 사이드바 패널 다섯 개가 가로로 나열되어 확장 상태에서 아이콘 전용 레일까지의 축소 단계를 비교한다. 타이포그래피는 중간 굵기의 산세리프 한 종을 쓰고 섹션 라벨만 작은 대문자 회색으로 눌러 계층을 만든다. 상단 워크스페이스 스위처와 커맨드 검색 필드, 접이식 섹션, 우측 정렬 카운트 배지, 컬러 아이콘의 프로젝트 목록, 하단 업그레이드 CTA 카드가 반복 구성 요소다. 선택 항목은 옅은 회색 필과 hover 시 나타나는 플러스 액션으로만 표시해 절제된 상태 표현을 유지한다. 사이드바 밀도와 축소 규칙을 설계할 때 상태 대조 레퍼런스로 쓸 만하다.
minimal · light-mode · corporate
claude-opus-5 · 2026-09-07 21:15 · 신뢰도 0.92
