아이콘, 제목, 설명을 격자로 배치하는 기능 소개 섹션. 아이콘은 ReactNode로 받고 열 수는 2열, 3열, 4열 중에서 고른다.
빠른 적용
폴더 하나 복사하면 끝. 빌드 설정이나 추가 의존성이 필요 없습니다.
접근성 기본
reduced-motion·스크린리더·no-JS 폴백을 패턴마다 기본으로 챙겼습니다.
토큰 기반
디자인 토큰만 바꾸면 라이트·다크 양쪽이 한 번에 우리 브랜드가 됩니다.
가벼운 성능
캔버스 패턴도 뷰 밖이면 rAF를 멈춰 메인 스레드를 돌려줍니다.
모바일 우선
좁은 화면에서 레이아웃이 무너지지 않게 브레이크포인트를 미리 잡았습니다.
조합 가능
모든 패턴이 자립형이라 원하는 것만 골라 서로 겹쳐 쓸 수 있습니다.
아이콘은 ReactNode로 받아 특정 아이콘 라이브러리에 묶이지 않습니다. cols로 2·3·4열 선택, 모바일은 자동 1열.
다른 패턴과 이어 붙인 화면에서 이 패턴이 어떤 자리에 놓이는지 볼 수 있습니다.