Back to Blog

Obsidian 入门73:别人家的 Obsidian 为什么那么好看?秘密就在这篇里

林小卫很行

这是一个「Obsidian x AI」系列。

入门 3 讲了怎么换主题,但只提了一嘴。这篇把它讲透:从直接装一个别人的主题,到动动手改点小东西,再到让 AI 帮你做一个属于自己的主题。

Obsidian 默认主题不难看,但很多人不知道它还能长成别的样子。

先给你看两张图。

第一张,是社区里的人用 Obsidian 的方式:

Esther Inspired 主题效果图,思谭有话说制作

*思谭有话说用 AI 做了一套 Obsidian + Typora 双版本的中文写作主题「Esther Inspired」,已经在 GitHub 开源。,并且上架到了Obsidian 的主题市场。

第二张,是群友深小乐的 Obsidian 首页:

深小乐定制的 Obsidian 首页效果

他花了两个小时,给自己做了个带绿植背景图的首页。

它们都是 Obsidian。和你电脑上装的是同一个软件。

区别只是主题

而且,这一切都不需要你会写代码。


最快的方式:点一下,换个主题

换主题是让 Obsidian 变脸最快的方式,不需要任何技术,三步搞定。

怎么换。

  1. 打开设置 → 外观 → 主题 Obsidian 外观设置界面,主题切换入口

  2. 点「管理」,进入社区主题市场 Obsidian 社区主题市场,按下载量排序

  3. 挑一个喜欢的,点「安装并启用」

主题市场里有成千上百个主题,按下载量排序就能看到最受欢迎的。每一个都有预览图,看着喜欢就装上试试。

换主题会影响我的笔记吗?

完全不会。主题只改变外观,不改你一个字的内容。不喜欢的话,点一下切换回默认主题,一切恢复原样。

随便试。


不想换整个主题,只想改几个小地方:CSS Snippets(读作死你劈死)

有时候你选了一个主题,整体喜欢,就一两个小地方不满意。比如标题颜色不是你想要的,或者行距太挤了。

这时候不需要换主题,也不用改主题文件。Obsidian 有一个叫 CSS Snippets 的功能,可以让你在不碰主题的情况下,单独覆盖几个样式。

怎么用。

  1. 打开设置 → 外观

  2. 往下翻到「CSS 代码片段」 CSS 代码片段设置路径:设置→外观→CSS 代码片段

  3. 点文件夹图标,打开 snippets 文件夹

  4. 在里面放一个 .css 文件,内容就是你想改的样式

  5. 回到 Obsidian,在设置里点一下刷新,然后启用它

给你几个可以直接复制粘贴的例子。

把标题改成你喜欢的颜色:

h1 { color: #e06c75; }
h2 { color: #61afef; }

加大正文的行距,读起来更舒服:

body { line-height: 1.8; }

我自己也在用。

我装的是 Baseline 主题,整体很喜欢,但有两处不太满意:浅色模式下的代码块灰灰的看不清,另外各个层级的标题不够有区分度。

于是我自己写了两个 CSS Snippet 来补:

一个把代码块在浅色模式下变成深色背景:

body.theme-light pre {
  background-color: #1e1e1e !important;
  border: 1px solid #2d2d2d !important;
  border-radius: 8px !important;
}

另一个给 6 级标题分别上色,从深蓝渐变到浅蓝,层一目了然:

.theme-light {
  --h1-color: hsl(216, 88%, 26%);
  --h2-color: hsl(212, 100%, 33%);
  --h3-color: hsl(210, 86%, 39%);
  --h4-color: hsl(208, 58%, 49%);
  --h5-color: hsl(209, 70%, 62%);
  --h6-color: hsl(209, 65%, 72%);
}

两个文件放进 snippets 文件夹,刷新启用,Baseline 就变成了我自己舒服的样子。

Baseline 主题使用 CSS Snippet 微调后的效果

你不需要理解 CSS 语法。网上搜「Obsidian CSS snippets 好看」能找到大量别人写好的现成代码段,复制到文件里就能用。


更进一步:让 AI 帮你做个主题

如果你想要的不只是改几个颜色,而是一整套属于自己的视觉风格:标题用什么字体、引用用什么底色、代码块什么配色、表格什么样。可以考虑自己做一个主题。

以前做主题需要懂 CSS,现在有 AI 了。

我的朋友 思谭有话说 就是这么干的。他把自己喜欢的配色和风格描述给 AI,AI 生成了一套完整的主题,取名叫 Esther Inspired,支持 Obsidian 和 Typora 两个平台,已经在 GitHub 开源,也已经上架 Obsidian 主题市场。

想法变成了一个真实的主题

如果你也想试试,可以给他一个 prompt 模板,大概长这样(在里面描述你喜欢的风格):

帮我生成一个 Obsidian 主题 CSS 文件。我喜欢的风格是:简约、暖色调、字体用苹方或思源宋体、标题用深橙色、引用块用浅黄色底、行距 1.8、代码块用深色背景。帮我生成完整的 obsidian.css 文件。

把这段发给 Claude 或者 ChatGPT,它会把完整的主题文件返回给你。把文件放到 Obsidian 的 snippets 文件夹里启用就行。

当然,不可能第一版就做出满意的样子。我相信这是一个一来一回的过程,你可以在和 AI 的来回中让它不断去优化和改进,并且你也能更加明确自己的需求。

做出来之后, 你是唯一一个拥有这个主题的人。


主题这件事,没有对错,只有喜欢和不喜欢。

如果你一直觉得 Obsidian 默认外观差点意思,但不知道怎么下手,今天就可以开始。先从社区主题市场翻翻看,装一个试试。不花时间,也没有风险。

如果你的 Obsidian 还没变成你喜欢的样子,今晚就可以开始动起来了。


进阶阅读

本系列基础篇

主题与美化

相关工具


如果你也有好看的 Obsidian 主题或者首页配置想分享,欢迎在评论区贴出来。

继续系统学习 Obsidian

这篇属于 Obsidian 相关教程。想按顺序学习,可以回到完整的 Obsidian 入门教程路径。