AI制作SVG图标注意事项

背景：新手小白制作svg图标的经验。高手请绕行，感谢。

1.AI新建文档

配置文件web

宽度和高度建议相同，图标我们来创建正方形的。

2.在画板中制作图标

图形：建立复合路径

文字：创建轮廓

3.保存为svg格式

勾选使用画板，全部

4.设置输出参数

配置文件：svg 1.1

文字：svg

子集化：仅使用的字形

图像位置：嵌入

更多选项：

CSS属性：演示文稿属性

输出较少<tspan>元素

5.编辑保存的svg文件源码

<?xml version="1.0" encoding="utf-8"?>

<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
width="160px" height="160px" viewBox="0 0 160 160" enable-background="new 0 0 160 160" xml:space="preserve">

修改为

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 160 160">

6.浏览器打开图标查看效果

至此结束。