AI 분석
어두운 2열 셀 그리드에 애니메이션 UI 컴포넌트를 하나씩 배치한 데모 페이지다.
상단 고정 헤더와 공지 바 아래로 얇은 구분선이 나누는 2열 셀 그리드가 화면을 채우고, 각 셀 하나가 컴포넌트 데모 한 개를 담는다. 거의 검정에 가까운 배경 위에 흰색 산세리프 텍스트와 보라·초록·주황 강조색만 절제해 쓰고, 셀 왼쪽 위에 코드·프리뷰 전환 아이콘 버튼 쌍이 반복된다. 물리 낙하하듯 쌓이는 컬러 태그 더미, 회전 스윕이 도는 레이더 그래프, 막대가 좌우로 채워지는 카운터 통계, 바늘이 움직이는 그라데이션 게이지, 점선 커넥터가 버튼으로 수렴하는 플로우 다이어그램, 일정 바가 겹치는 타임라인이 각각 다른 모션 패턴을 보여준다. 후반 프레임에서 라이트 모드로 전환되며 같은 구성이 밝은 배경에서도 유지된다. 컴포넌트 단위로 모션과 상태를 분리해 보여주는 데모 페이지 구성과 다크·라이트 양면 대응 설계의 레퍼런스로 쓸 만하다.
dark-mode · minimal · techy · high-contrast
claude-opus-5 · 2026-09-07 09:47 · 신뢰도 0.78
