前端工具

CSS 可视化

CSS 可视化汇总

地址：https://css.bqrdh.com

扁平化图标

地址：https://neumorphism.io/

它创造了一种全新的 UI 风格。来自世界各地的设计师已经在 Dribbble 和 Behance 上看到了引人注目的中性设计。

渐变的图标

地址：https://www.iconshock.com/svg-icons/

在设计的时候，我们都注重简约。不过，有时我们喜欢添加一些渐变效果，这样会显得图标层次更加丰富一些，而这个工具，就可以帮助我们提升工作效率，哪怕你没有设计能力，你也可以设计出漂亮的图标。

其他 ICON 网址：https://www.extrabux.cn/chs/guide/7254153

动画

地址：https://animista.net/

庞大的动画库。在这里，你将找到可用于组件，照片和文本的基本，以及更高级的动画。

动画缓动曲线

地址：https://easings.co/

在一系列界面上测试常见的缓动曲线。或生成自己的自定义贝塞尔曲线。

动画按钮（磁吸）

地址：https://tympanus.net/Development/MagneticButtons/index.html

有一些有趣的悬停动画的磁性按钮。这些按钮的主要思想是它们具有磁性并跟随鼠标指针。除此之外，还有一些有趣的悬停动画可以玩。要探索的一件非常不错的事情是附加元素（例如阴影或另一条线）的运动。通过不同地移动按钮元素而创建的视差效果，使动画具有很好的扭曲效果。

背景图案

地址：https://www.magicpattern.design/tools/css-backgrounds

你可以在项目中使用漂亮的纯 CSS 背景图案。

地址：https://bansal.io/pattern-css

仅用 CSS 库就可以完成美丽图案填充空背景效果。

SVG 波浪

地址：https://svgwave.in/

一个在线工具，可以生成各种波浪效果的 SVG 图像，可以用于网页背景、按钮等。

自定义形状分隔线

地址：https://www.shapedivider.app/

划分布局和形状已经变得非常时尚。使用此工具，你可以创建可响应的波形和自定义形状分隔线。