애니메이션
Snap Reticle
조준경 크로스헤어 커서가 pointermove를 추적하다 data-target 요소의 스냅 반경에 들어오면 자석처럼 잠기고, 네 개의 코너 브래킷이 대상을 감싸며 확대된다.
- 분류
- 애니메이션
- 난이도
- hard
- 변형
- TS-TW
설치
npx shadcn@latest add https://gasan.ai.kr/tools/effect/r/SnapReticle-TS-TW
Props
| 이름 | 타입 | 기본값 | 설명 |
|---|---|---|---|
| reticleColor | string | #C084FC | 레티클(크로스헤어) 색상 (기본 바이올렛) |
| bracketColor | string | #5EEAD4 | 스냅 잠금 시 코너 브래킷과 HUD 라벨 색상 (기본 틸) |
| snapRadius | number | 90 | 타겟에 자석 스냅이 걸리는 반경(px). 클수록 멀리서도 잠금 |
| bracketSize | number | 18 | 타겟을 감싸는 코너 브래킷 한 변의 길이(px) |
| reticleSize | number | 40 | 레티클 원의 지름(px) |
| followStrength | number | 0.22 | 스프링 추종 강도(0~1). 클수록 즉각적, 작을수록 부드럽게 지연 |