טקסטProחדש
אותיות מגיבות לסמן
אותיות קרובות לסמן משנות גודל, צבע או טשטוש, והרחוקות נשארות כמו שהן. אפשר להנפיש כל מאפיין CSS.
התאמה
color
activeColor
מבוסס על Text Cursor Proximity (MIT רישיון) · תנאי שימוש
מאפיינים
9 מאפיינים| מאפיין | סוג | ברירת מחדל | תיאור |
|---|---|---|---|
| children | ReactNode | — | הטקסט. |
| styles | { [cssProperty]: { from, to } } | — | אילו מאפייני CSS משתנים, מאיזה ערך לאיזה. |
| containerRef | RefObject<HTMLDivElement | null> | — | האלמנט שבו נמדד מיקום הסמן. |
| radius | number | 50 | טווח ההשפעה סביב הסמן, בפיקסלים. |
| falloff | 'linear' | 'exponential' | 'gaussian' | "linear" | כמה מהר האפקט נחלש עם המרחק. |
| as | ElementType | "span" | תגית ה-HTML של האלמנט. |
| className | string | — | מחלקות נוספות. |
| color | string | "#ffffff" | צבע האותיות הרחוקות מהסמן. |
| activeColor | string | "#737373" | הצבע שהאותיות מקבלות ליד הסמן. |
תלויות
3 חבילות נדרשות
npm install motion clsx tailwind-merge