배경
Counterflow Grid
여러 행의 둥근 셀 격자가 인접 행마다 서로 반대 방향으로 무한 스크롤하며 흐르는 Canvas2D 배경 컴포넌트.
- 분류
- 배경
- 난이도
- medium
- 변형
- TS-TW
설치
npx shadcn@latest add https://gasan.ai.kr/tools/effect/r/CounterflowGrid-TS-TW
Props
| 이름 | 타입 | 기본값 | 설명 |
|---|---|---|---|
| rows | number | 5 | 화면을 세로로 나눌 마퀴 행의 개수. |
| speed | number | 60 | 마퀴 스크롤 속도(px/초). 클수록 빠르게 흐른다. |
| gap | number | 16 | 한 행 내 셀 사이 간격(px). |
| colors | string[] | ["#C084FC", "#EC4899", "#5EEAD4"] | 셀에 순환 적용할 브랜드 강조색 팔레트. |
| background | string | "#08060E" | 배경 색(근-블랙). |
| radius | number | 14 | 셀 모서리 둥글기(px). |