---
version: alpha
name: "Mono"
description: "干净的白底、Geist 字体和一个钴蓝色，为文档和开发者工具设计。 Mono 是为开发者产品准备的安静系统：白色页面、Geist 和 Geist Mono、细线描边，链接和主要操作只用一个钴蓝色。代码块、表格和 API 参考是主角，不是附属品。"
colors:
  primary: "#2450E6"
  on-primary: "#FFFFFF"
  secondary: "#0F9F6E"
  tertiary: "#D97706"
  neutral: "#5D6470"
  surface: "#FFFFFF"
  on-surface: "#0B0C0E"
typography:
  display-lg:
    fontFamily: "Geist"
    fontSize: 60px
    fontWeight: 600
    lineHeight: 1.05
    letterSpacing: -0.025em
  headline-lg:
    fontFamily: "Geist"
    fontSize: 40px
    fontWeight: 600
    lineHeight: 1.1
    letterSpacing: -0.02em
  headline-md:
    fontFamily: "Geist"
    fontSize: 28px
    fontWeight: 600
    lineHeight: 1.2
    letterSpacing: -0.01em
  headline-sm:
    fontFamily: "Geist"
    fontSize: 20px
    fontWeight: 600
    lineHeight: 1.3
  body-md:
    fontFamily: "Geist"
    fontSize: 16px
    fontWeight: 400
    lineHeight: 1.55
  body-sm:
    fontFamily: "Geist"
    fontSize: 13px
    fontWeight: 400
    lineHeight: 1.45
rounded:
  sm: 4px
  md: 6px
  lg: 8px
  xl: 12px
spacing:
  xs: 4px
  sm: 8px
  md: 16px
  lg: 24px
  xl: 48px
components:
  button-primary:
    backgroundColor: "{colors.primary}"
    textColor: "{colors.on-primary}"
    rounded: "{rounded.lg}"
    padding: "{spacing.md}"
---

## Overview

Mono 是为开发者产品准备的安静系统：白色页面、Geist 和 Geist Mono、细线描边，链接和主要操作只用一个钴蓝色。代码块、表格和 API 参考是主角，不是附属品。

## Colors

- **primary (#2450E6):** 钴蓝，用于链接、主按钮和侧边栏里的当前项。
- **on-primary (#FFFFFF)**
- **secondary (#0F9F6E):** 翡翠绿，用于成功状态、diff 里新增的行和第二组图表数据。
- **tertiary (#D97706):** 琥珀色，用于警告、弃用提示和第三组数据。
- **neutral (#5D6470):** 冷调石板灰，用于描述、行号和元信息。
- **surface (#FFFFFF):** 纯白，卡片和页面同色，靠描边区分；深色模式是近黑色。
- **on-surface (#0B0C0E)**

## Typography

全站用 Geist：标题字重 600，从 60px 到 20px；正文字重 400，16px，行高 1.55。代码、命令、快捷键和版本号用 Geist Mono。

## Layout

内容放在最大 1280px 的 12 栏网格上，栏间距 24px，间距单位 4px。文档页左侧是导航栏，中间是约 72 个字符宽的正文，右侧是本页目录。

## Shapes

卡片、代码块、输入框和按钮用 8px 圆角。所有区块用 1px 浅灰描边分隔，不用阴影。

## Components

带复制按钮和文件名标签的代码块、提示和警告框、可切换 npm、pnpm、bun 的安装命令、快捷键标签，以及 ⌘K 搜索框。

## Do's and Don'ts

- 每页靠前的位置放一段能直接运行的示例代码。
- 命令、路径和参数一律用 Geist Mono。
- 不能点的东西不要用蓝色。
- 不要用渐变、插画和发光效果做装饰。
