AI 분석
아이콘 레일과 라벨 패널 두 상태를 라이트·다크 모드로 나란히 보여주는 사이드바 컴포넌트다.
좁은 아이콘 레일과 라벨이 붙은 확장 패널을 한 쌍으로 배치해 같은 내비게이션의 두 상태를 비교하도록 구성한다. 패널 상단에 브랜드 마크·검색 필드·접기 토글을 한 줄로 묶고 그 아래 단일 칼럼 메뉴를 넉넉한 행 간격으로 쌓으며, 하단은 프로필 카드와 업그레이드 프로모 카드로 마감한다. 선형 아이콘과 작은 산세리프 라벨, 옅은 회색 활성 하이라이트, 부드러운 라운드 카드가 톤을 만들고 보라·주황 그라데이션 아바타만 색 강조로 쓴다. 레일에서는 활성 항목에 어두운 툴팁이 붙어 축소 상태의 레이블링 방식을 드러낸다. 라이트와 다크 대응, 축소·확장 전환, 하단 프로모 슬롯 처리까지 담아 내비게이션 설계 레퍼런스로 쓰기 좋다.
minimal · light-mode · dark-mode · techy
claude-opus-5 · 2026-09-07 21:09 · 신뢰도 0.93