首先设计一个自己的LOGO，我使用的是 Adobe 的 Illustrator（下文简称Ai），你可以使用 CorelDRAW 或各种矢量绘图软件，也可以直接使用在线版的SVG网站。

在线SVG制作网站

在Ai里画完图后导出成SVG

之后打开在线网站，点击 OPEN SVG

选择刚才导出的SVG文件后点击上传

之后就能看到LOGO的预览，然后点击右上角的GET CODE

网站以弹出SVG的代码界面，点击左下角的COPY SVG即可

之后打开Typecho的后台，选择网站外观设置，再点击设置外观

然后点击初级设置选择日间模式下博客logo的HTML结构
把刚才复制的SVG代码粘贴上去然后点击保存设置就可以了

你回到首页上就发现logo已经生效了，但是它的缩放有些问题，这时候我们按F12 或者右键点击检查进入审查界面（我这里使用的是Edge，Chromium内核的浏览器也都差不多）之后点击下图圈起来的按钮在页面中选择一个元素进行检查然后把鼠标移动到刚制作的SVG LOGO上，元素就会高亮显示，同时右边的代码框也会高亮显示，这条代码也就是我们的SVG代码，在这里我们可以修改logo的显示区域大小、宽度、高度、以及填充颜色，他们分别是viewBox width height fill。

不断调试直到logo达到你想要的位置，然后把相应的修改粘贴到之前的日间模式下博客logo的HTML结构中进行保存。

这里对SVG颜色的修改进行演示
fill=后面的值为16进制颜色代码，可以在网络上搜索相应的颜色所对照的值。
在这里我对它进行修改，使它变成一个亮一点的颜色以适配黑暗模式。
选择一个深色模式的颜色替换到夜间模式下博客logo的HTML结构中即可。

最后修改：2021 年 06 月 05 日
© 允许规范转载
请作者喝咖啡！