텍스트 애니메이션
Gravity Text
떨어질 텍스트. 접근 이름(aria-label)에 원문과 '애니메이션 다시 재생' 동작이 함께 제공된다.
- 분류
- 텍스트 애니메이션
- 난이도
- hard
- 변형
- TS-TW
설치
npx shadcn@latest add https://gasan.ai.kr/tools/effect/r/GravityText-TS-TW
Props
| 이름 | 타입 | 기본값 | 설명 |
|---|---|---|---|
| text | string | (required) | 떨어질 텍스트. aria-label로 원문이 그대로 제공된다. |
| gravity | number | 1400 | 중력 가속도(px/s^2). 클수록 빠르게 낙하한다. |
| bounce | number | 0.55 | 바닥 반발 계수(0~1). 클수록 높이 튄다. |
| stagger | number | 0.09 | 글자 간 낙하 시작 지연(초). 순차적으로 우수수 떨어진다. |
| dropHeight | number | -140 | 초기 낙하 시작 높이(px, 위쪽). 음수 방향으로 시작한다. |
| colorFrom | string | #C084FC | 그라디언트 시작 색(왼쪽 글자 계열). |
| colorTo | string | #EC4899 | 그라디언트 끝 색(오른쪽 글자 계열). |
| className | string | undefined | 래퍼에 적용할 추가 클래스. |
| style | CSSProperties | undefined | 래퍼에 적용할 인라인 스타일. |