텍스트 애니메이션
Shuffle Text
제자리에 고정된 글자 색상. 기본값 #EC4899(Vivid Kit 마젠타)가 항상 적용된다.
- 분류
- 텍스트 애니메이션
- 난이도
- medium
- 변형
- TS-TW
설치
npx shadcn@latest add https://gasan.ai.kr/tools/effect/r/ShuffleText-TS-TW
Props
| 이름 | 타입 | 기본값 | 설명 |
|---|---|---|---|
| text | string | (required) | 최종적으로 정렬되어 나타날 목표 텍스트. |
| shuffleSpeed | number | 40 | 무작위 문자 갱신 프레임 간격(ms). 작을수록 빠르게 섞임. |
| settleInterval | number | 110 | 글자 하나가 제자리에 고정되기까지의 간격(ms). 클수록 천천히 정렬. |
| characters | string | ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789 | 섞을 때 사용할 무작위 문자 집합. |
| shuffleColor | string | #C084FC | 아직 섞이는 중(미고정) 글자의 강조 색상. Vivid Kit 바이올렛. |
| settledColor | string | #EC4899 | 제자리에 고정된 글자 색상. 미지정 시 기본값 #EC4899(Vivid Kit 마젠타)가 그대로 적용된다. |
| className | string | undefined | 루트 span에 적용할 추가 CSS 클래스. |