UD5工具箱
Particles.js
Particles.js 是一款轻量级的开源 JavaScript 库，用于在网页上创建基于 Canvas 的粒子动画效果。它支持多种粒子形状、颜色、运动模式和交互效果，广泛应用于网站背景、着陆页、个人主页等场景。在本工具中，所有配置参数都是为生成 Particles.js 兼容的 JSON 格式而设计的。
粒子数量（Particles Number）
粒子数量决定了画面中同时存在的粒子个数。数量越多，画面越丰富密集，但浏览器渲染负担也越大；数量越少，画面越简约轻量，性能表现也越好。在本工具中，您可以将粒子数量设置为 0 到数千之间的任意值，建议根据页面性能和视觉需求找到平衡点。
粒子形状（Shape）
粒子形状定义了每个粒子的外观轮廓。Particles.js 支持 Circle（圆形）、Edge（方形）、Triangle（三角形）、Polygon（多边形）和 Star（星形）五种基本形状。不同形状在视觉风格上有明显差异，圆形柔和自然，方形现代简洁，三角形和星形则更具动感。本工具的配置面板支持对每种形状进行独立选择和参数调整。
粒子大小（Size）
粒子大小定义了粒子的直径范围，由最小值和最大值两个参数控制。每个粒子的大小会在最小值和最大值之间随机生成，这种随机性让画面更加自然生动。最小值和最大值的差距越大，粒子的大小差异越明显，视觉层次感越强。在本工具中，您可以通过滑块精确设置这两个数值。
透明度（Opacity）
透明度参数控制粒子的可见程度，取值范围为 0 到 1。值为 1 时表示完全不透明，粒子清晰可见；值接近 0 时粒子几乎不可见，呈现若隐若现的效果。合理设置透明度可以让粒子与背景自然融合，避免过于突兀。在本工具中，透明度设置同时影响粒子本身的显示效果。
连线系统（Lines Linked）
连线系统是指在距离较近的粒子之间自动绘制连接线的功能。当两个粒子之间的距离小于设定的连线距离阈值时，它们之间就会产生一条连线。连线效果可以营造出网络、星座、神经网络等科技感十足的视觉氛围。连线距离参数控制连线的密度范围，线条颜色和宽度控制视觉表现。本工具支持独立配置连线的各项属性。
鼠标交互（Interactivity）
鼠标交互是指粒子对用户鼠标操作的响应行为，包括悬停（Hover）和点击（Click）两种触发方式。悬停效果在鼠标经过粒子附近时触发，点击效果在鼠标点击时触发。每种触发方式都支持多种响应模式，如 Grab、Bubble、Repulse、Push、Remove 等。交互功能让静态的粒子背景变得生动有趣，增强用户参与感。
移动方向（Move Direction）
移动方向参数控制粒子在画面中的整体运动趋势。Particles.js 支持八个方向（top、top-right、right、bottom-right、bottom、bottom-left、left、top-left）以及静止状态（none）。不同的运动方向配合不同的速度设置，可以模拟风力、水流、雪花飘落等各种自然现象。在本工具的配置面板中，您可以通过下拉菜单选择合适的移动方向。