ะšัƒั€ัะพั€ั‹ะะพะฒะพะต

ะœะฐะณะฝะธั‚ะฝั‹ะต ั‚ะพั‡ะบะธ

ะกะตั‚ะบะฐ ั‚ะพั‡ะตะบ, ะบะพั‚ะพั€ะฐั ั€ะฐััั‚ัƒะฟะฐะตั‚ัั ะฟะตั€ะตะด ะบัƒั€ัะพั€ะพะผ ะธะปะธ ัะพะฑะธั€ะฐะตั‚ัั ะบ ะฝะตะผัƒ. ะขะพั‡ะบะธ ั€ัะดะพะผ ั ะบัƒั€ัะพั€ะพะผ ัั€ั‡ะต.

ะะฐัั‚ั€ะพะนะบะธ

color

ะšะพะผะฟะพะฝะตะฝั‚ Codearia ยท ะฃัะปะพะฒะธั ะธัะฟะพะปัŒะทะพะฒะฐะฝะธั

ะŸะฐั€ะฐะผะตั‚ั€ั‹

9 ะฟะฐั€ะฐะผะตั‚ั€ะพะฒ
ะŸะฐั€ะฐะผะตั‚ั€ะขะธะฟะŸะพ ัƒะผะพะปั‡ะฐะฝะธัŽะžะฟะธัะฐะฝะธะต
colorstring"#e5e5e5"ะฆะฒะตั‚ ั‚ะพั‡ะตะบ.
spacingnumber22ะ ะฐััั‚ะพัะฝะธะต ะผะตะถะดัƒ ั‚ะพั‡ะบะฐะผะธ, ะฒ ะฟะธะบัะตะปัั….
dotSizenumber1.6ะ ะฐะดะธัƒั ั‚ะพั‡ะบะธ, ะฒ ะฟะธะบัะตะปัั….
radiusnumber120ะšะฐะบ ะดะฐะปะตะบะพ ะดะพัั‚ะฐั‘ั‚ ะบัƒั€ัะพั€, ะฒ ะฟะธะบัะตะปัั….
strengthnumber0.6ะะฐัะบะพะปัŒะบะพ ัะธะปัŒะฝะพ ัะดะฒะธะณะฐัŽั‚ัั ั‚ะพั‡ะบะธ.
mode'repel' | 'attract'"repel"ะขะพั‡ะบะธ ัƒะฑะตะณะฐัŽั‚ ะพั‚ ะบัƒั€ัะพั€ะฐ ะธะปะธ ั‚ัะฝัƒั‚ัั ะบ ะฝะตะผัƒ.
autoDemobooleantrueะะตะฒะธะดะธะผั‹ะน ะบัƒั€ัะพั€ ะณัƒะปัะตั‚ ะฟะพ ัะตั‚ะบะต, ะฟะพะบะฐ ะฟะพัะตั‚ะธั‚ะตะปัŒ ะฝะต ะดะฒะธะฝัƒะป ะผั‹ัˆัŒ.
childrenReactNodeโ€”ะกะพะดะตั€ะถะธะผะพะต ะฟะพะฒะตั€ั… ัั„ั„ะตะบั‚ะฐ.
classNamestringโ€”ะšะปะฐััั‹ ะดะปั ะพะฑั‘ั€ั‚ะบะธ.

ะ—ะฐะฒะธัะธะผะพัั‚ะธ

ะŸะฐะบะตั‚ะพะฒ: 3

npm install ogl clsx tailwind-merge

ะŸะพั…ะพะถะธะต ะบะพะผะฟะพะฝะตะฝั‚ั‹

ะกะผะพั‚ั€ะตั‚ัŒ ะฒัะต