feat: 品牌改版 v2 — 跟随霓虹数据流 logo
- logo 矢量化:青→蓝→紫渐变 S 数据流(logo.tsx + favicon.svg,web/admin 共用) - 全站配色跟随 logo:强调色青瓷绿 → 青蓝(浅 #0284C7 / 暗 #38BDF8),中性色转冷蓝,终端窗深岩蓝底 - 紫色克制使用:仅 logo 与 .text-brand-gradient(Hero 标题"AI Agent 工作台"渐变字) - 导航/页脚/admin 顶栏/登录页挂载 logo 标记 - 终端窗与代码块的提示符、光标、事件标签同步换色 Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
+48
-28
@@ -3,39 +3,46 @@
|
||||
|
||||
@custom-variant dark (&:is(.dark *));
|
||||
|
||||
/* ── 设计 token(设计稿 v0.2)────────────────────────────
|
||||
青瓷绿单强调色;中性色整体向青绿偏移;
|
||||
终端窗双主题共用深色。 */
|
||||
/* ── 设计 token(品牌改版 v2:跟随 logo)────────────────
|
||||
霓虹数据流 logo:青 #34E5E0 → 蓝 #3B82F6 → 紫 #A855F7;
|
||||
强调色取青蓝段,紫色只在 logo 与品牌渐变里出现;
|
||||
中性色向冷蓝偏移,终端窗为深岩蓝底。 */
|
||||
:root {
|
||||
--ground: #f6f8f7;
|
||||
--ground: #f5f7f9;
|
||||
--surface: #ffffff;
|
||||
--ink: #16211d;
|
||||
--ink-2: #55665f;
|
||||
--ink-3: #8a9891;
|
||||
--hairline: #e1e8e4;
|
||||
--hairline-strong: #c9d4cf;
|
||||
--accent: #0e7c6b;
|
||||
--accent-ink: #0a5a4e;
|
||||
--accent-soft: #e3f1ec;
|
||||
--code-bg: #edf2f0;
|
||||
--term-bg: #10201b;
|
||||
--term-ink: #c7e8de;
|
||||
--ink: #151c24;
|
||||
--ink-2: #526069;
|
||||
--ink-3: #8595a0;
|
||||
--hairline: #e0e7ec;
|
||||
--hairline-strong: #c6d2da;
|
||||
--accent: #0284c7;
|
||||
--accent-ink: #075985;
|
||||
--accent-soft: #e0f2fe;
|
||||
--code-bg: #ebf1f5;
|
||||
--term-bg: #0e1620;
|
||||
--term-ink: #c9e4f5;
|
||||
--brand-g1: #0891b2;
|
||||
--brand-g2: #2563eb;
|
||||
--brand-g3: #9333ea;
|
||||
}
|
||||
|
||||
.dark {
|
||||
--ground: #0d1311;
|
||||
--surface: #131b18;
|
||||
--ink: #e7efeb;
|
||||
--ink-2: #93a69f;
|
||||
--ink-3: #64756e;
|
||||
--hairline: #22302b;
|
||||
--hairline-strong: #35453f;
|
||||
--accent: #3ecdad;
|
||||
--accent-ink: #6fdfc6;
|
||||
--accent-soft: #12352d;
|
||||
--code-bg: #182420;
|
||||
--term-bg: #0a1512;
|
||||
--term-ink: #a9d8cb;
|
||||
--ground: #0b1117;
|
||||
--surface: #111925;
|
||||
--ink: #e6edf3;
|
||||
--ink-2: #93a6b4;
|
||||
--ink-3: #62737f;
|
||||
--hairline: #1f2c38;
|
||||
--hairline-strong: #32434f;
|
||||
--accent: #38bdf8;
|
||||
--accent-ink: #7dd3fc;
|
||||
--accent-soft: #0b3049;
|
||||
--code-bg: #14202b;
|
||||
--term-bg: #0a121b;
|
||||
--term-ink: #bfe3f7;
|
||||
--brand-g1: #22d3ee;
|
||||
--brand-g2: #60a5fa;
|
||||
--brand-g3: #c084fc;
|
||||
}
|
||||
|
||||
@theme inline {
|
||||
@@ -75,6 +82,19 @@ body {
|
||||
color: var(--accent-ink);
|
||||
}
|
||||
|
||||
/* 品牌渐变文字(logo 同源:青→蓝→紫),克制使用 */
|
||||
.text-brand-gradient {
|
||||
background: linear-gradient(
|
||||
92deg,
|
||||
var(--brand-g1),
|
||||
var(--brand-g2) 55%,
|
||||
var(--brand-g3)
|
||||
);
|
||||
-webkit-background-clip: text;
|
||||
background-clip: text;
|
||||
color: transparent;
|
||||
}
|
||||
|
||||
/* 文章排版 — prose 对齐设计 token */
|
||||
.prose-site {
|
||||
--tw-prose-body: var(--ink-2);
|
||||
|
||||
Reference in New Issue
Block a user