AI 분석
확장형과 아이콘 전용 축소형을 나란히 보여주는 프로젝트 관리 SaaS 사이드바 내비게이션 설계다.
화면 전체가 하나의 사이드바 컴포넌트에 집중된 컴포넌트 스터디이며, 라벨이 보이는 확장 패널과 아이콘만 남는 축소 레일을 짝지어 배치해 두 상태를 직접 비교하게 한다. 라이트 테마는 연회색 배경 위에 흰 패널과 옅은 구분선으로 대비를 낮추고, 다크 테마는 거의 검정에 가까운 배경에 낮은 채도의 회색 텍스트를 얹어 같은 구조를 그대로 옮긴다. 상단 워크스페이스 스위처, 슬래시 단축키가 붙은 검색 필드, 셰브런이 달린 1차 메뉴, 접을 수 있는 즐겨찾기 섹션, 하단 사용자 행과 플랜 배지로 구성이 나뉜다. 활성 항목은 연보라 배경 칩과 같은 색 텍스트로만 표시하고, 축소 상태에서는 항목 이름과 키보드 단축키를 담은 어두운 툴팁이 옆으로 뜬다. 사이드바 축소 동작과 테마별 토큰 대응, 선 아이콘 세트의 일관성을 한 번에 참고하기 좋은 자료다.
minimal · light-mode · dark-mode · monochrome
claude-opus-5 · 2026-09-07 16:17 · 신뢰도 0.93