精选 · 开放 · 免费

Weights & Biases

一个企业级AI平台，运用暗色主题与俏皮的手写注释，为复杂技术工具赋予人性化温度。

01

设计气质 DNA

兼具个性触感的高性能工程仪表盘

02

色彩

高对比度暗色主题，以活力琥珀色传递温暖感，并以标志性青色用于次要行动号召

03

字体

transitional-serif · humanist-sans · monospace

• display80px · 400
• h148px · 400
• body20px · 400

大型展示字体与权威标题使用过渡衬线体 · 正文与UI元素使用人文无衬线体 · 代码块与类终端界面使用等宽字体 · 手写注释（例如“easy”）作为特殊装饰层叠加于标准字体之上

04

间距

采用标准4px网格，配以充裕的留白以强调尺度与重要性

05

表面 (圆角 / 阴影 / 边线)

使用rgba(43, 48, 59, 1.0)的1px实线边框，用于容器的细微界定

rgba(10, 14, 21, 0.5) 0px -1px 16px 0px · rgba(10, 14, 21, 0.5) 0px 16px 16px 0px

06

布局

居中的宽格式布局，带有清晰的章节分隔，采用双栏网格展示代码示例

07

动效与交互

按钮与交互元素的悬停状态 · 悬停时细微的背景色过渡 · 交互卡片元素的变换效果

背景色略微变深或变浅；光标变为指针。 · 提供即时视觉反馈，伴有轻微的缩放或色彩偏移。

08

组件

• button 主按钮为实心琥珀色配深色文字；次按钮为青色配深色文字。轮廓按钮用于导航链接。
• card 深色、略带抬升效果的容器，用于代码块与功能模块，具有圆角和细微阴影。
• chip 小型徽章，边框圆角为50%，用于状态指示或装饰性圆点。
• input 设计为类终端窗口样式，带行号，采用深色背景与等宽字体。
• hero 大规模居中标题，叠加俏皮的手写注释，辅以清晰的价值主张与突出的行动号召。

09

文案语气与禁用清单

• 语气 专业且平易近人，融合技术精确性与俏皮的自信感。
• 标题风格 大胆、宣言式的语句，偶尔加入俏皮的修正（例如将“hard”划掉改为“easy”）。
• 按钮文案 直接且以行动为导向，使用大写字母以示强调（例如“GET STARTED WITH WEAVE”）。

• 避免使用浅色背景——截图显示的是以#202226为主背景的暗色主题
• 避免在大型展示标题中使用无衬线体——截图显示主标题使用的是过渡衬线字体
• 避免使用红色作为主行动号召色——截图显示琥珀色（#FCBC32）是主导强调色
• 避免使用严格、纯粹功能性的布局——截图显示在标准字体之上叠加了俏皮的手写风格注释
• 避免使用微小、密集的容器——截图显示主要组件具有充裕的内边距与间距
• 避免为背景使用复杂的渐变——截图显示以纯色深色为主，仅在装饰元素中使用偶尔的细微渐变
• 避免: 避免过于企业化或枯燥的语言
• 避免: 避免杂乱或混乱的布局
• 避免: 避免使用纯粹极简、冷峻的美学风格
• 避免: 避免在没有视觉支持的情况下使用复杂行话

10

包内真实截图

抓自真实页面 · 真 computed styles

11

System Prompt

en · zh-CN · zh-TW · ja · ko