텍스트 애니메이션
Glyph Wave Text
텍스트를 오프스크린 캔버스에 래스터화해 픽셀 밝기를 ASCII 밀도 문자로 매핑하고, 시간 sin 웨이브로 글자가 물결처럼 일렁이게 만드는 효과. 글리프 색은 밀도에 따라 틸 → 기준색(color) → 마젠타로 보간된다.
- 분류
- 텍스트 애니메이션
- 난이도
- hard
- 변형
- TS-TW
설치
npx shadcn@latest add https://gasan.ai.kr/tools/effect/r/GlyphWaveText-TS-TW
Props
| 이름 | 타입 | 기본값 | 설명 |
|---|---|---|---|
| text | string | "VIVID" | ASCII로 그릴 텍스트. 부모 요소의 aria-label로 원문이 제공된다. |
| columns | number | 48 | 가로 글리프 열 수(해상도). 클수록 촘촘하고 또렷하지만 무거워진다. |
| ramp | string | " .:-=+*#%@" | 밀도 램프(어두움→밝음 순). 왼쪽=빈 공간, 오른쪽=빽빽한 글자. |
| waveAmplitude | number | 1.2 | 시간 웨이브의 진폭(셀 단위). 0이면 정지, 클수록 크게 출렁인다. |
| waveSpeed | number | 2.2 | 웨이브 속도(초당 위상 진행). 클수록 빠르게 흐른다. |
| color | string | "#C084FC" | 글리프 색 기준 팔레트 인덱스(밀도에 따라 teal→violet→magenta 보간). |