← 设计与 CSS
设计与 CSS · 本地运行

CSS 剪切路径形状生成器

选择一个有界几何预设,并生成符合标准的 clip-path 多边形,带有实时颜色预览且无需上传设计数据。

准备就绪。您的工作数据保留在此浏览器中。

为什么这个工具有用

无需手动编辑坐标对或信任任意粘贴的 CSS,即可制作原型徽章、头像、图像蒙版和装饰面板。

工作原理

固定的本地注册表将每个命名形状映射到经过审核的百分比坐标;只有所选预设和已验证颜色会进入生成的声明。

实际示例

选择 Hexagon 以用六个均衡边遮罩一个橙色活动磁贴,然后将生成的多边形粘贴到该磁贴现有的 class 中。

验证

计算是确定性的,并解释验证错误,而不是默默更改无效输入。

隐私边界

输入和输出保留在此标签页中。复制和下载通过浏览器API完成,无需上传到服务器。

结果护照

每次运行都会报告其工具模式、时间戳以及输入/输出大小,以便对转换后的数据进行审计。