Monad

一份温暖羊皮纸风格的科技期刊
Monad 在其整个界面中使用温暖的羊皮纸画布(#f6f3f1),立即区别于典型的纯白色 SaaS 模板。标题采用 Untitled Serif 字体,字重 400 —— 从不加粗 —— 而正文、导航和所有 UI 文本均使用 ABC Diatype Mono,使网站呈现出技术手册般的质感,仿佛是为文学杂志排版的文档。唯一鲜明的湖蓝色(#2b59d1)用于主要操作;其余部分均处于温暖的灰度调色板中,因此淡紫色卡片表面(#cfdaf5)和柔和的粉彩渐变(珊瑚、天空、薄荷、金色)被视为有意识的强调,而非杂音。组件采用细线边框和 100px 胶囊容器,而非阴影,整体节奏保持平静且宽敞,区块间有 40px 卡片内边距和充足的纵向留白。
查看原始网站使用规范
建议采用
- 所有标题均使用 Untitled Serif 字重 400 —— 从不加粗;该衬线字体的笔画对比和 -0.02em 字间距在视觉上承担了分量
- 所有正文、按钮、导航标签、徽章和功能 UI 文本均使用 ABC Diatype Mono —— 等宽字体是品牌声音本身
- 所有按钮和标签的圆角半径设置为 100px 或 9999px —— 胶囊形状是该系统的容器语言
- 使用 Parchment(#f6f3f1)作为页面画布 —— 从不替换为纯白色(#ffffff);温暖的色调是标志性特征
- 将湖蓝色(#2b59d1)专用于每屏唯一的主操作;其他所有按钮使用 Off-Black 或透明描边变体
- 所有边框和分隔线使用 1px 实线 Ash(#cecac8) —— 避免使用更粗的线宽或更深的边框颜色
- 所有导航标签、按钮和标签文本通过等宽字体家族应用大写 + 紧凑字间距
建议避免
- 标题从不加粗或使用 600 以上的字重 —— 所有 Untitled Serif 标题在所有尺寸下均保持 400 字重
- 从不使用纯白色(#ffffff)作为页面背景 —— 始终使用 Parchment(#f6f3f1)以保留温暖表面
- 从不将湖蓝色(#2b59d1)用于除单个主操作填充之外的任何用途 —— 若分散使用则会失去意义
- 从不以无衬线字体替代等宽正文字体 —— 等宽与衬线的搭配是该设计系统的标志性排版手法
- 永远不要为卡片添加阴影效果——应使用1px Ash边框和表面颜色对比(米色→淡紫)来实现立体感
- 从不为卡片设置小于 16px 的圆角,或为按钮设置小于 100px 的圆角 —— 该系统为胶囊形与柔和矩形,从不锐利
- 从不为 UI 元素引入额外的强调色 —— 柔和色系(天空、薄荷、珊瑚、金色)仅作为装饰性使用,应出现在插画和渐变渲染中