此功能在 Meta Personal branding for the splash screen 上被高度请求。
我们现在添加了添加静态或动画 SVG 作为启动画面图像的选项，以替换默认的加载点指示器：
如果使用静态 SVG，它会出现在加载点动画的上方：
否则，如果使用动画 SVG，它会完全替换这些点：
请注意，出于性能原因，动画 SVG 应仅使用 CSS transform 或 opacity 动画。[^\text{1}]
您可以通过我们的“即将进行的更改”系统（/admin/config/upcoming-changes）启用此功能：
splash screen image（启动画面图像）站点设置用于此目的。您可以在 SVG 中使用 var(--primary)、var(--secondary) 和 var(--tertiary) CSS 变量来引用主题的颜色并适应深色模式。
需要注意的是，启用此功能可能会影响您的 LCP 分数，因此最好的尝试方法是进行更改，等待一段时间，然后检查它是否对 LCP 或 Google Search Console 中的索引有任何影响。
27 个赞
philh
3
1 个赞
eisammy
(Sammy)
4
如何替换这些点？对我来说只显示放置我的 svg 标志
1 个赞
我们目前没有添加自定义 CSS 的方法，因为此屏幕在应用程序的大部分内容加载之前加载，并且存在更多限制。您能在这里分享您正在使用的 SVG 图像（或私信我）吗？我可以进行一些测试，看看我们的默认设置是否可以提供更多兼容性。
3 个赞
请注意，我们在允许的 SVG 动画方面有了一个细微的改动（我已经更新了 OP 以反映这一点）。最初我们允许 SVG 中的 SMIL 动画，但事实证明这些动画会卡顿，因为浏览器在 JavaScript 执行时会暂停此类动画。
因此，现在的建议是只在 SVG 中使用 CSS transform 和 opacity 动画，因为这些不会被 JS 阻塞。
如果您看一下上面 @ばこん 的 SVG……它提供了一个可允许的动画的好例子：
@keyframes unique-slide {
0% { transform: translateX(-80px); }
100% { transform: translateX(260px); }
}
另外，请注意为您的动画指定唯一的名称，以免与 Discourse 中的其他动画冲突（“blink”、“rotate”、“fade”等名称可能过于通用）。使用像 unique- 这样的前缀是避免这种情况的好方法。
6 个赞
Falco
(Falco)
14
Google 刚刚发布了 Gemini Pro 3.1，他们对该模型的第一项重点介绍是动画 SVG。很自然地，我尝试为 https://discourse-on-a-pi5.falco.dev/ 制作一个加载器，仅用 2 个提示就得到了这个结果
与此新功能搭配得非常好！
14 个赞
Bas
(Bas van Leeuwen)
15
那太棒了，法尔科 
我需要看看 Gemini 能用 Discourse 标志做什么 
2 个赞
Falco
(Falco)
16
是的，我对结果非常满意！我用模型尝试这个很久了，这是第一个能很好处理的。
这是提示：
生成一个 SVG 动画，用作关于树莓派迷你板电脑论坛的加载动画。动画必须使用 SVG 内联 CSS 完成。
生成了：
然后我接着说：
太棒了！你能改变树莓派本身，红色的六边形，动画吗？它们从左上角向右下角对角移动，但不在中心，看起来很奇怪。也许我们可以让它们保持静态和居中，并使用更微妙的动画？
然后生成了我分享的版本：
唯一有争议的是 SVG 代码中有很多 CSS 注释，例如：
/* Base Animation & Board Styles */
当您将其保存为 SVG 文件时，这些注释是无效的，所以我手动删除了包含这些注释的 7 行。
3 个赞
Bas
(Bas van Leeuwen)
17
你的结果比我好多了。
只迭代了几次就放弃了，这是我得到的最好的结果 
抱歉，各位，把话题带偏了 
让我们回到欣赏 Falco 的作品和讨论启动画面吧！
6 个赞
Falco
(Falco)
18
恐怕 Discourse 的标志限制可能太严格了。
我试过
生成一个将在讨论论坛上用作加载动画的动画 SVG。该论坛运行在 Discourse 上，因此它可以在 SVG 中使用它的一些主题，比如彩虹色的对话气泡？动画必须使用 SVG 内联 CSS 完成。
得到了
6 个赞
Falco
(Falco)
19
我们应该举办一个动画的 Discourse 启动页设计大赛！
6 个赞
Canapin
(Coin-coin le Canapin)
20
你有没有想过将 Gemini 设置为“专业”模式？它可能不是默认设置。
2 个赞
