currentcolor 是最稳的起点，适用于内联 svg 且未硬编码 fill/stroke 的场景；外链 svg、内部固定颜色或 use 引用未设继承均会导致失效。

直接用 currentColor 是最稳的起点

只要 SVG 是内联写法（即 <svg></svg> 标签直接出现在 HTML 中），且没硬编码 fill 或 stroke 值，currentColor 就能立刻生效。它会自动继承父元素的 color CSS 属性，不需要 JS 干预。

常见失效点： - <img src="icon.svg"> 这种外链方式完全不支持 currentColor，因为 SVG 被隔离在独立文档上下文 - SVG 内部写了 fill="#333" 或 fill="black"，会覆盖父级 color - 用了 <use href="#home"></use> 但没给包裹层加 fill: currentColor，或者源 <symbol></symbol> 自己带了固定颜色

推荐写法：<svg fill="currentColor"><path d="..."></path></svg>。比把 fill="currentColor" 写在 <path></path> 上更可靠——它会向下透传，除非子元素显式覆盖。

Article To Html

文章转信息图。将文章/笔记转化为手机可读的 HTML 信息图，自动匹配视觉风格。触发场景：文章转图、笔记转图、信息图、转小红书图、做张图、可视化这篇文章、文生图。

下载

fill 和 stroke 的 JS 动态设置要避开 DOM 时机陷阱

用 querySelector 找 SVG 元素后直接改 setAttribute('fill', '#f00') 看似简单，但容易在元素未加载完成时执行失败。尤其当 SVG 来自异步加载、Vue/React 组件渲染或 <use></use> 引用时，DOM 节点可能还没就位。

稳妥做法： - 对内联 SVG，确保脚本放在

前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！