这几个“小”玩意,好用!💝

2,656 阅读1分钟

大家好,我是半夏👴,一个刚刚开始写文的沙雕程序员.如果喜欢我的文章,可以关注➕ 点赞 👍 加我微信:frontendpicker,一起学习交流前端,成为更优秀的工程师~关注公众号:搞前端的半夏,了解更多前端知识! 点我探索新世界!

Make some waves!

getwaves.io/

这是一个创建波浪的SVG生成器。你可以指定波浪的

  • 形状
  • 方向
  • 颜色
  • 不透明度
  • “曲线”

image.png

分隔符制作

wweb.dev/resources/c…

这个真的太爱了,通常我在制作公司官方之类的网站的时候,会用到这个网站,一键生成代码。

image.png

CSS Grid Generator

cssgrid-generator.netlify.app/

可以通过鼠标分割合并单元格,快速的生成CSS grid代码,我觉得这个工具对于新手这个工具是极好的,毕竟Grid是极好的。当然,类似的网站时很多的,如果你觉得这个不好,可以告知我,我这还有很多。

image.png

CSS Clip Path Maker

bennettfeely.com/clippy/

clip-path CSS 属性使用裁剪方式创建元素的可显示区域。区域内的部分显示,区域外的隐藏。

例如三角形,多边形,以及一些不规则的图形,例如箭头,❌,我们都可以用它制作。 我觉得一些个人的博客网站,公司官网,可以适当的引入,增加趣味性。

image.png

花式边框生成器

9elements.github.io/fancy-borde…

最近在开发个人的博客,总是觉得特别的无趣,没啥好玩的点,所以我就开始搜”好玩的CSS“,最后发现了这个宝贝网站,说实话,有些图形,我是真的不会写!!!

image.png