视觉设计框架
数字龙标智能体服务平台设计规范
版本 V1.0•2025年1月
01设计理念
品牌核心
品牌
数字龙标
核心
智能体 + 执行
主张
端到端智能
口号
智能落地
设计关键词
力量执行落地专业可信赖国际化
气质意象
日出东方，巨龙腾飞。晨曦中，一条暖橙色的龙剪影破云而出，昂首向上。 阳光穿过云层，洒下金色光芒，照亮大地。这是行动的力量，是落地的决心，是执行的结果。
暖橙主色
大地底色
金色点缀
02色彩体系
配色原则
- ✓Logo橘红色不变
- ✓背景深蓝带微调色差，形成层次
- ✓橙黄色仅用于小色块（标签、徽章）
- ✓白字确保清晰有亮度
禁止使用
- ✗purple, violet, fuchsia（AI味过重）
- ✗紫蓝渐变（千篇一律的AI风格）
- ✗高饱和霓虹色（虚幻感）
03字体体系
标题字体
中文：思源黑体 / Noto Sans SC
英文：Inter / Plus Jakarta Sans
现代无衬线，力量感
正文字体
中文：思源黑体 / Noto Sans SC
英文：Inter
清晰易读，专业感
数据字体
DIN / Space Grotesk
数字展示专用
技术感，等宽数字
04圆角与间距体系
设计原则：专业但不生硬，友好但不幼稚。主选 sm / md 圆角，传递精致专业感。
05阴影体系
xs
微浮阴影
卡片悬浮
sm
轻浮阴影
按钮悬停
md
中浮阴影
弹窗模态
lg
深浮阴影
侧边栏
glow
橙色发光
品牌强调
06间距体系
基础单位：4px
所有间距为 4px 的倍数
xs
4px
sm
8px
md
16px
lg
24px
xl
32px
2xl
48px
3xl
64px
07布局框架
栅格系统
移动端 (<768px)4列 / 16px间距
平板 (768-1024px)8列 / 24px间距
桌面 (1024-1440px)12列 / 24px间距
大屏 (>1440px)12列固定1200px
内容层级
├── Page（页面）
├── Section（区块）
├── Module（模块）
├── Card（卡片）
└── Element（元素）
08组件规范
表单规范
09图标规范
图标风格
- • 风格：线性图标（Stroke）
- • 粗细：1.5px - 2px
- • 圆角：小圆角，保持一致性
- • 大小：16px / 20px / 24px / 32px
- • 颜色：继承文字颜色或品牌色
推荐图标库
Lucide Icons
风格统一、开源免费
Heroicons
支持多尺寸、多粗细
10动效规范
即时反馈
100-150ms
按钮点击、开关切换
快速过渡
200-300ms
悬停、下拉展开
标准过渡
300-400ms
页面切换、弹窗出现
动效原则：克制 · 有意义 · 不干扰。动效服务于功能，不为了炫技。每个动效都有目的：引导、反馈、过渡。
11响应式策略
| 屏幕 | 导航 | 侧边栏 | 内容区 |
|---|---|---|---|
| 移动端 | 底部Tab | 隐藏（抽屉） | 单列 |
| 平板 | 顶部栏 | 可折叠 | 双列 |
| 桌面 | 顶部栏 | 固定展开 | 多列 |
12暗黑模式
亮色模式
背景#FAFAF8
卡片#FFFFFF
文字#1A1A1A
边框#E5E5E0
暗色模式
背景#1A1A1A
卡片#2A2A2A
文字#F5F5F5
边框#3A3A3A