Particles
Дрейфующее созвездие. Частицы соединяются, когда рядом, и реагируют на курсор — отталкиваются, притягиваются или связываются.
зависимости 0файлы tsx + tsпараметры 10react 18+
X 0000 Y 0000
Пульт10 параметров
01density
/100k px²
Масштабируется вместе с контейнером.
02color
Цвет частиц и связей.
03minSize
px
Наименьший радиус.
04maxSize
px
Наибольший радиус.
05speed
Скорость дрейфа.
06linkDistance
px
0 — без связей.
07linkOpacity
Яркость связей.
08mouseMode
Поведение у курсора.
09mouseRadius
px
Радиус действия курсора.
10twinkle
Медленное мерцание.
01 Пропсы
| Проп | Тип | По умолчанию | Описание |
|---|---|---|---|
density | number | 9 | Масштабируется вместе с контейнером. |
color | string | "#edeae3" | Цвет частиц и связей. |
minSize | number | 0.6 | Наименьший радиус. |
maxSize | number | 2.2 | Наибольший радиус. |
speed | number | 0.35 | Скорость дрейфа. |
linkDistance | number | 110 | 0 — без связей. |
linkOpacity | number | 0.25 | Яркость связей. |
mouseMode | 'repel' | 'attract' | 'connect' | 'none' | "repel" | Поведение у курсора. |
mouseRadius | number | 140 | Радиус действия курсора. |
twinkle | boolean | true | Медленное мерцание. |
className | string | — | Передаётся корневому элементу. |
style | CSSProperties | — | Передаётся корневому элементу. |