主题变量指南

开发主题时，理解并覆盖 Obsidian 的 CSS 变量是核心工作。本文说明如何查看、覆盖与新增变量。

核心要点

列出常用变量

• 在 styles.css 中用 :root 或 .theme-dark / .theme-light 作用域覆盖：

:root {
  --accent-h: 258;          /* 色相 */
  --accent-s: 60%;          /* 饱和度 */
  --accent-l: 60%;          /* 亮度 */
  --interactive-accent: hsl(var(--accent-h), var(--accent-s), var(--accent-l));
}

• 1.13 起支持 Style Settings 插件可视化编辑变量，主题可暴露 --my-theme-* 供用户调

覆盖策略

• 优先覆盖语义变量（--text-normal 等），而非逐个组件写死
• 用 :root 定义基础，用 .theme-dark / .theme-light 处理模式差异
• 三模式（明亮/黑暗/节日）可通过切换根类实现，参考 CSS 变量手册

注意事项

• 不要破坏 --file-line-width 等影响排版的核心变量
• 发布前在明暗两种模式实测对比度，确保可读

相关阅读

• 主题与 API分区
• CSS 变量手册
• CSS 变量手册