diff --git a/app/app.vue b/app/app.vue
index 079d0ad..4e70374 100644
--- a/app/app.vue
+++ b/app/app.vue
@@ -11,6 +11,25 @@ useHead({
const desktopBg = siteConfig.theme.background || "";
const mobileBg = siteConfig.theme.backgroundMobile || "";
+
+// 将 siteConfig.theme.color 转换为 CSS 变量
+const hexToRgb = (hex: string) => {
+ const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
+ return result
+ ? `${parseInt(result[1]!, 16)}, ${parseInt(result[2]!, 16)}, ${parseInt(result[3]!, 16)}`
+ : "189, 131, 243";
+};
+
+const primaryColor = siteConfig.theme.color || "#bd83f3";
+const primaryRgb = hexToRgb(primaryColor);
+
+useHead({
+ style: [
+ {
+ innerHTML: `:root { --site-primary: ${primaryColor}; --site-primary-rgb: ${primaryRgb}; }`,
+ },
+ ],
+});
diff --git a/app/components/blog/Header.vue b/app/components/blog/Header.vue
index 0594ca4..3842a93 100644
--- a/app/components/blog/Header.vue
+++ b/app/components/blog/Header.vue
@@ -40,7 +40,7 @@ withDefaults(defineProps
+ class="text-3xl md:text-4xl lg:text-5xl font-extrabold text-zinc-800 dark:text-zinc-100 mb-6 tracking-tight leading-tight break-words">
{{ title }}
@@ -49,7 +49,7 @@ withDefaults(defineProps