逐帧造梦,
晨光也能开始
同一个 AirDrama,深色保留专业影视气场,浅色继承 Vercel × GitBook 的玻璃语言 —— 强光环境 / 投资人 demo / 白天工作都更舒服。
素材管理
统一管理参考视频 / 图像 / 音频,@提示词即可调用
一键生成
Seedance 2.0 高质量 / Fast 快速,首尾帧或全能参考
消费分析
团队消费、用户排行、趋势图,精确到 token
02 — 玻璃质感拆解
Frosted Glass · 配方
参考 Framer / GitBook hero card 的"半透明白 + backdrop-blur + saturate + inset highlight"标准实现。深色下白卡浮在彩色 aurora 上 / 浅色下白卡浮在 pastel 装饰上 —— 不变的是穿透与微高光。
编辑
导出
模式
历史
下一步建议:试试用首尾帧模式快速生成转场镜头...
玻璃配方
bg: rgba(255,255,255,0.65)
backdrop-filter: blur(40px) saturate(180%)
border: 1px solid rgba(255,255,255,0.7)
inset 0 1px 0 rgba(255,255,255,0.5)
shadow: 0 8px 32px rgba(0,0,0,0.06)
backdrop-filter: blur(40px) saturate(180%)
border: 1px solid rgba(255,255,255,0.7)
inset 0 1px 0 rgba(255,255,255,0.5)
shadow: 0 8px 32px rgba(0,0,0,0.06)
03 — 登录页玻璃 modal
Login · 浅色玻璃化
V1 错:LandingPage 强制 dark,登录卡始终深色。V2:LandingPage 跟随主题切换,浅色下 LoginModal 是透明白玻璃,后面 pastel aurora 透过来。薄荷绿在浅色下加深为 teal 保证对比度。
Air Drama
目前仅限受邀创作者体验
04 — 后台仪表盘
App · 平面 + 阴影边
后台 / 生成页主区不要全玻璃 —— 数据要专注。Vercel 风格:纯白实体卡 + 1px 阴影边 + 多层柔阴影。Sidebar 例外,继续玻璃。
仪表盘
总团队数
12
↑ 8.3%
总用户数
347
↑ 12.4%
今日消费
¥1,284
↓ 2.1%
本月消费
¥42.6k
↑ 23.7%
用户
团队
消费 (本月)
状态
screenshot_user
默认团队
¥1,284.50
启用
huhaonan
影视组
¥3,920.10
启用
maruoqing
影视组
¥520.00
配额满
05 — 色板
Token · 浅色映射
切换主题观察色板差异。深色 → 浅色不是简单反色,而是按"语义"重新映射 —— 玻璃面用透明白、状态色加深 18% (WCAG AA)、文字走 Vercel 灰阶。
--color-bg-page
—
--color-bg-glass
—
--color-bg-card
—
--color-bg-sidebar
—
--color-primary
—
--color-success
—
--color-danger
—
--color-text-primary
—
06 — 字体层级
Typography · Inter + Noto Sans SC
Inter 做拉丁字 + Noto Sans SC 做中文,开启 OpenType cv01 / ss03 让字形更几何。深浅模式字号 / 字重不变,只换颜色。
Display
逐帧造梦,晨光开始
48px · 600 · -0.02em
Heading
影视专业 / 投资人 demo / 白天工作
24px · 600 · -0.015em
Body
AirDrama 把生成 / 编辑 / 资产管理 / 团队配额一站打通,目标是工业级影视协作工具。
16px · 400 · 1.6
Small
支持火山 Seedance 2.0 / 2.0 Fast,token 实时计费,失败自动重试。
14px · 400 · secondary
Caption
最后更新于 2026-05-11 · 主题切换 V2 alignment showcase
12px · 400 · tertiary
07 — 按钮 / Chip
Actions
主要决策:CTA 用品牌主色还是 GitBook 黑?Chip 风格?这一节展示备选,你挑。
主 CTA 三选:品牌紫 / GitBook 黑 / Ghost · 矩形 vs Pill
新版 AirDrama V2 主题切换上线
Beta
启用
配额满
Chip / Status pill — 暖米色公告 chip / 信息 chip / 状态 pill
08 — 设计决策待定
Open Questions
1. CTA 主按钮:品牌紫 #5048cc / GitBook 黑 #171717 / 双轨?
建议:营销页主 CTA 用 GitBook 黑加冲击力,产品内用品牌紫保持识别。
2. AuroraCanvas 浅色处理:保留 / pastel / 完全隐藏? Showcase 用了 pastel 紫蓝桃方案。如果觉得花,可以浅色直接 `opacity: 0.5` 压一档。
3. 整体气质偏向:GitBook (橙暖) / Linear (中性冷) / Vercel (纯净灰)? Showcase 默认 Vercel 灰 + Linear pastel aurora 混合。GitBook 那种橙是品牌色不抄,但暖 chip 我们留着用在公告。
4. Modal overlay 强度:浅色下保留多少黑? V2 plan 是 `rgba(0,0,0,0.20)` 较弱。如果想"重要弹窗更突出",可以 0.35。
5. 字体:继续 Noto Sans SC(目前) / 切换到 Inter + 中文混排? Inter 字面更紧凑现代,Noto Sans SC 更"温和"。Showcase 用了 Inter 拉丁 + Noto 中文。
2. AuroraCanvas 浅色处理:保留 / pastel / 完全隐藏? Showcase 用了 pastel 紫蓝桃方案。如果觉得花,可以浅色直接 `opacity: 0.5` 压一档。
3. 整体气质偏向:GitBook (橙暖) / Linear (中性冷) / Vercel (纯净灰)? Showcase 默认 Vercel 灰 + Linear pastel aurora 混合。GitBook 那种橙是品牌色不抄,但暖 chip 我们留着用在公告。
4. Modal overlay 强度:浅色下保留多少黑? V2 plan 是 `rgba(0,0,0,0.20)` 较弱。如果想"重要弹窗更突出",可以 0.35。
5. 字体:继续 Noto Sans SC(目前) / 切换到 Inter + 中文混排? Inter 字面更紧凑现代,Noto Sans SC 更"温和"。Showcase 用了 Inter 拉丁 + Noto 中文。