애니메이션
Droplet Rings
커서가 움직일 때 물방울이 떨어진 듯 확장하는 동심 링 파동이 굴절감과 함께 번지는 Canvas2D 스플래시 커서 효과.
- 분류
- 애니메이션
- 난이도
- medium
- 변형
- TS-TW
설치
npx shadcn@latest add https://gasan.ai.kr/tools/effect/r/DropletRings-TS-TW
Props
| 이름 | 타입 | 기본값 | 설명 |
|---|---|---|---|
| ringCount | number | 4 | 동심 링(파동 겹) 개수. 클수록 촘촘한 물결이 겹겹이 퍼진다. |
| splashRadius | number | 90 | 파동이 도달하는 최대 반경(px). 물방울 하나가 번지는 크기. |
| spawnDistance | number | 26 | 새 스플래시를 만들 커서 이동 최소 거리(px). 작을수록 더 자주 파동이 생성된다. |
| lifespan | number | 46 | 각 파동의 지속 시간(60fps 기준 프레임 수). 클수록 오래 남는다. |
| lineWidth | number | 2.4 | 링 선 두께 기준값(px). 파동 테두리의 굵기와 코어 크기에 반영된다. |
| glow | number | 14 | 링 경계의 발광(글로우) 강도. 0이면 글로우 없이 선명한 선만 표시. |