AI 분석
아바타 컴포넌트의 사용 사례를 2열 카드로 나열한 밝은 디자인 시스템 문서다.
거의 흰색에 가까운 배경 위에 얇은 테두리의 프리뷰 카드가 2열 그리드로 반복되며 스크롤되는 문서 화면이다. 상단에는 큰 제목과 회색 설명 한 줄, 작은 Docs 버튼이 놓이고 우측 상단에는 사이드바 토글과 검색 아이콘이 알약형 컨트롤로 고정된다. 각 카드는 Preview와 Code 탭을 밑줄 인디케이터로 전환하며, 단일 아바타, 상태 점이 붙은 아바타, 겹친 아바타 스택, 툴팁이 뜨는 스택, 이름표가 붙은 알약, 사용자 수 표시 스택, 이니셜 폴백, 로딩 상태까지 변형을 한 화면에 정리한다. 후반 프레임에서는 코드 탭이 열려 구문 강조된 JSX 스니펫이 같은 카드 안에 표시된다. 컴포넌트 변형을 문서에서 어떻게 나열하고 프리뷰와 코드를 한 카드에 묶을지 참고하기 좋다.
minimal · light-mode · techy
claude-opus-5 · 2026-09-07 21:45 · 신뢰도 0.82