浏览器开发者工具可以通过显示正在应用的样式来帮助弄清这一点。对于 Chrome/Firefox，右键单击其中一个标题图标并选择“检查”。
查找样式窗格，它会显示影响该元素的所有 CSS 代码。图标本身的颜色应由 color 属性控制。看起来您的可能还设置了 background-color 为“primary”。
右侧显示了每个 CSS 样式块的源文件名。其中许多来自核心 Discourse（例如截图中的“header.scss”）。如果显示类似“theme_6.scss”的内容，则可能来自您的主题或其他活动的主题组件。您可以单击文件名进行查看，了解该代码在文件中的位置（或参考文件名右侧的行号）。
最后，您可以打开和关闭样式面板中的属性，以查看删除它们后会是什么样子（将鼠标悬停在属性上会看到一个复选框）。它们的优先级从高到低排列，因此通常顶部的属性会覆盖下面的任何属性。例如，在截图中可以看到，“buttons.scss”中的 color: var(--primary-low-mid) 被覆盖了（通过划掉表示）。
如果看不到任何明显问题，您可以尝试在元素选项卡中选择父元素来查找那里的样式。在这种情况下，svg 图标位于链接 (<a>) 元素内，该元素又位于列表项 (<li>) 元素内，背景色可能来自其中一个。
在主题中找到有问题的 CSS 代码后，您应该能够安全地将其删除，以恢复到默认外观！