컴포넌트
Pixel Bloom
호버 또는 포커스 시 Canvas2D 격자의 픽셀들이 카드 중심에서 바깥으로 물결처럼 순차 페이드-인 되고, 벗어나면 역순(바깥 → 중심)으로 빠지는 픽셀 카드.
- 분류
- 컴포넌트
- 난이도
- medium
- 변형
- TS-TW
설치
npx shadcn@latest add https://gasan.ai.kr/tools/effect/r/PixelBloom-TS-TW
Props
| 이름 | 타입 | 기본값 | 설명 |
|---|---|---|---|
| pixelSize | number | 12 | 픽셀 한 칸의 크기(px). 작을수록 조밀한 격자. |
| pixelColor | string | #C084FC | 순차 페이드로 채워지는 기본 픽셀 색상. |
| accentColor | string | #EC4899 | 간헐적으로 섞이는 강조 픽셀 색상. |
| maxOpacity | number | 0.85 | 채워진 픽셀의 최대 불투명도(0~1). |
| speed | number | 1 | 채움/빠짐 전파 속도 배율. 클수록 빠르게 번짐. |