텍스트 애니메이션
Cipher Reveal
무작위 문자로 스크램블되었다가 목표 텍스트로 한 글자씩 확정되는 복호화(해킹) 느낌의 텍스트 애니메이션.
- 분류
- 텍스트 애니메이션
- 난이도
- medium
- 변형
- TS-TW
설치
npx shadcn@latest add https://gasan.ai.kr/tools/effect/r/CipherReveal-TS-TW
Props
| 이름 | 타입 | 기본값 | 설명 |
|---|---|---|---|
| text | string | (필수) | 최종적으로 확정될 목표 텍스트. |
| speed | number | 45 | 스크램블 프레임 간격(ms). 작을수록 랜덤 문자가 빠르게 깜빡인다. |
| revealDelay | number | 90 | 한 글자가 확정될 때까지 걸리는 시간(ms). 클수록 천천히 복호화된다. |
| characters | string | "ABCDEFGHIJKLMNOPQRSTUVWXYZ!@#$%^&*()_+-=<>?/{}[]" | 스크램블에 사용할 무작위 문자 집합. |
| scrambleColor | string | "#EC4899" | 아직 확정되지 않은(스크램블 중) 글자 색상. 기본값은 Vivid Kit 마젠타. |
| revealedColor | string | undefined | 확정된 글자 색상. 미지정 시 currentColor를 상속한다. |
| className | string | undefined | 래퍼 span에 적용할 Tailwind/CSS 클래스. |