애니메이션
Gradient Cursor
커서를 rAF lerp로 부드럽게 추격하는 그라데이션 글로우 원. blur와 mix-blend-mode로 은은하게 표현되며 컨테이너 내부로 한정된다.
- 분류
- 애니메이션
- 난이도
- medium
- 변형
- TS-TW
설치
npx shadcn@latest add https://gasan.ai.kr/tools/effect/r/GradientCursor-TS-TW
Props
| 이름 | 타입 | 기본값 | 설명 |
|---|---|---|---|
| colorA | string | #C084FC | 글로우 중심 색상 (기본: 바이올렛) |
| colorB | string | #EC4899 | 글로우 외곽 색상 (기본: 마젠타) |
| size | number | 240 | 글로우 원 지름(px) |
| smoothing | number | 0.14 | 추격 부드러움 (0~1, 작을수록 느리고 부드러움) |
| blur | number | 40 | blur 강도(px) |
| blend | boolean | true | mix-blend-mode(screen) 사용 여부 |
| className | string | undefined | 컨테이너 추가 클래스 |
| children | React.ReactNode | undefined | 컨테이너 내부에 표시할 콘텐츠 |