Clippy:一个超好用的CSS clip-path可视化生成器,拖拽就能做多边形遮罩
做前端或者折腾个人网站的朋友,应该都有过因为写一个自定义多边形裁切而反复调试CSS的经历吧?说实话,clip-path那堆百分比坐标手动拼起来真是脑壳疼,尤其是想要一个不对称的抽象形状,简直想摔键盘。后来偶然发现了一个叫 Clippy 的小工具,瞬间治好了我的救火焦虑。打开即用,纯前端,无注册这个网站页面极其简洁,打开就是一块画布和一个预设形状库。你可以在预设里选一个基础多边形(比如三角形、六边形、星形等),然后直接拖拽画布上的锚点来调整顶点位置,实时看到预览效果。右侧会同步更新对应的 clip-path CSS 代码,直接复制就能用到项目里。更妙的是,它还支持自定义顶点数量,甚至可以添加控制点来拉出曲线,做流线型的遮罩。▲ bennettfeely.com 首页截图(仅供参考,以官网为准)适合谁用?如果你是前端开发者、UI设计师,或者经常给图片做创意裁切的爱好者,这个工具绝对能省下不少时间。它不吃配置,完全在浏览器里运行,离线也能用(因为所有逻辑都在一个页面里)。连参数微调都很直观,不用再靠数学算坐标了。不妨现在就打开 Clippy 试试,把你相册里那张无聊的矩形照片变成独特的多边形风格吧!

