SchemaX 是一个 Schema 驱动的静态内容平台。它用 Schema 定义站点自身的内容、设计令牌、组件契约和消息格式，并在构建时校验。

这段文字展示了 .sx-article 容器的默认排版效果：46rem 阅读宽度、1.0625rem 字号、1.8 行高。所有排版元素都在这个容器内被样式化。

h1 · 一级标题 Level 1

一级标题通常出现在文章头部，正文内较少使用。最大字号 2.5rem，极粗字重 800。

h2 · 二级标题 Level 2

二级标题是正文中最常用的章节标题。2rem 字号，与 h1 同样的极粗字重。

h3 · 三级标题 Level 3

三级标题用于子章节。1.5rem 字号，仍然保持极粗字重以确保层级清晰。

h4 · 四级标题 Level 4

四级标题用于更细的分区。1.2rem 字号。

h5 · 五级标题 Level 5

五级标题为大写小节标注，uppercase + letter-spacing。

h6 · 六级标题 Level 6

六级标题为最小标注，uppercase + 更大 letter-spacing + 降低透明度。

Schema 是连接意图与执行的结构化桥梁。它让不确定性的系统输出，变成可验证、可依赖的输入。

了解 设计令牌系统 如何驱动整站的视觉一致性。当你在代码中写入--sx-sys-color-accent，它将在构建时被替换为真实的颜色值。

在编辑器中按下 Ctrl + S 保存文件。这是 SchemaX 强调的 确定性：每一处取值都有明确来源。

无序列表 Unordered

• Schema 定义数据结构
• Validator 校验输入是否符合 Schema
• Parser 将原始数据转换为结构化对象
  • JSON Schema 是最通用的描述语言
  • TypeScript 类型是编译期的 Schema
  • Zod 在运行时提供类型安全的校验
• Runtime 根据校验结果决定执行路径

有序列表 Ordered

1. 用户发出自然语言请求
2. 模型根据 Tool Schema 生成结构化参数
3. 运行时校验参数是否符合 Schema
4. 校验通过 → 调用工具执行
5. 返回结果给模型，进入下一轮

Schema 看起来很小，但它处在多个系统的关键连接处：提示词与工具、模型与 API、前端与后端、人类意图与机器执行之间。

引用块左侧有蓝色竖线标识，正文使用斜体以区别于普通段落。上下的 margin-block: 1.5rem 提供足够的呼吸空间。

在 TypeScript 中，Zod 的 z.object() 可以定义一个工具参数的 Schema：

import { z } from 'zod';

const weatherSchema = z.object({
  city: z.string().describe('城市名称'),
  unit: z.enum(['celsius', 'fahrenheit']).default('celsius'),
});

代码块自带 Shiki 语法高亮、文件名标签、行高亮（ins 标记新增行）和复制按钮。在 MDX 内容中，三反引号语法会自动触发同样的渲染。

页面视觉强度分级

图片使用 <figure> + <figcaption> 语义包裹。figcaption 使用 0.85rem 字号 + 70% 透明度居中显示。

段落之间的分隔线：

分隔线使用纯 CSS border-top，无额外元素。

折叠区块 Details

Schema

描述数据结构的形式化语言，定义字段、类型、约束与嵌套关系。

Token

设计令牌。以 DTCG JSON 格式定义的视觉变量（颜色、间距、阴影等），由 Style Dictionary 构建为 CSS 自定义属性。

:where()

CSS 选择器函数，特异性为 0。用于 article 层，确保组件和 overrides 层能干净地覆盖排版样式。

Neo-brutalism

新粗野主义设计风格。特征为低圆角、粗边框、实心硬阴影、高对比度，追求物理裁切般的视觉质感。