컴포넌트
MorphingDots
여러 점이 세로 막대로 늘어났다 다시 점으로 줄어드는 모핑을 위상차로 물결처럼 반복하는 Canvas2D 로더.
- 분류
- 컴포넌트
- 난이도
- medium
- 변형
- TS-TW
설치
npx shadcn@latest add https://gasan.ai.kr/tools/effect/r/MorphingDots-TS-TW
Props
| 이름 | 타입 | 기본값 | 설명 |
|---|---|---|---|
| count | number | 5 | 점(막대)의 개수 |
| barLength | number | 52 | 막대로 늘어났을 때의 최대 세로 길이(px) |
| duration | number | 1600 | 모핑 왕복 한 주기 시간(ms), 작을수록 빠름 |
| stagger | number | 0.5 | 점마다 부여되는 위상차(0~1), 클수록 물결이 뚜렷 |
| palette | "vivid" | "purplePink" | "mint" | "vivid" | 색상 팔레트 프리셋 |
| showToggle | boolean | true | 재생/일시정지 토글 버튼 표시 여부 |