学习教程
图标绘制
https://www.bilibili.com/video/BV1zz4y1d7su/?vd_source=ef114f70c3fd4d5394f12dbd3d022bbe
https://www.bilibili.com/video/BV1V7411N7Dt?spm_id_from=333.999.0.0
https://www.bilibili.com/video/BV1JE411H7Up?spm_id_from=333.999.0.0
一.iconfont导入figma图标
iconfont支持蓝色
https://www.iconfont.cn/
使用插件:Fill Rule Editor
1.figma导入iconfont问题
会遇到图标不一致的情况
图标由黄色改为蓝色
2.需要Flatten之后好用,选中内层图标,不要变成组件,直接改图形,目标是把它变成蓝色的
需要点击高亮处,把空隙里面内容去掉
另外要在原子组件里调
二.图标库推荐
免费可商用
图标库大合集:
https://icones.js.org/
图标库推荐:
- https://phosphoricons.com/
- https://iconsax.io/
- https://iconoir.com/
- https://tablericons.com/
- https://remixicon.com/
三.图标技巧
1.半个像素:
把线右键转成形状
2.移动:
cmd+a
全选锚点一起移动
3.拖动:
选中某几个锚点一起拖动
4.常用数据:
线粗细:1.5
移动位置:0.5,0.75
细圆角:0.8,0.5
缝隙也和图标一样粗细,用描边来减去,以此制作加号周围的空隙
线段不能直接加圆角的,转成形状后再加圆角
5.网格追随
这块可以取消网格追随 这里就可以任意缩放图标
6.视觉中心
以视觉中心判断图标效果