主参考 / Primary Reference
Atlassian Foundations
更像 foundations 首屏和规则入口的系统文档写法。
打开参考网站 / Open Reference设计系统基座 (Design System Foundation)
更像 foundations、tokens、guidelines 和 component rules 首页的系统文档家族，主角不是营销 hero，而是规则、部件和设计治理本身。
设计系统组件规范基础库
真实网站参考 / Real References
先看这些真实网站 / Open these real sites first
长这样 / Looks Like
- foundation 导航
- 规则先行
- 侧栏稳定
- 部件层级清楚
适合做 / Good For
- 设计系统
- 组件规范
- 基础库
不适合做 / Not For
- 情绪品牌页
- 慢内容首页
- 沉浸发布页
Skill 包含什么 / What The Skill Controls
截图、排版和规则来自同一套风格包 / The screenshots, layout, and rules come from the same skill packet
配色系统 / Color System
- 中性浅底或深底都可以
- 颜色要服务规则和部件区分
- 不要用品牌营销色压过系统信息
排版系统 / Typography
- 层级像文档系统而不是品牌广告
- 术语、部件名和说明文字都要很好扫
- 标题克制但清楚
版式规则 / Layout Rules
- foundation、component、pattern 要是一级入口
- 侧栏或分组导航必须稳定
- 规则页面要支持长期生长
图片处理 / Image Treatment
- 图例、tokens、组件截图和示意图都可以作为视觉证据
- 少用情绪化 hero 图
- 例子要比装饰重要
交互节奏 / Motion
- 几乎不需要戏剧化动效
- 状态反馈要清楚
- 交互应该像工具文档而不是 campaign
AI Prompt / AI Prompt
复制后直接粘贴给 Cursor / Claude / Paste directly into Cursor / Claude
请参考设计系统基座（Design System Foundation）风格建站：
视觉特征：foundation 导航 / 规则先行 / 侧栏稳定 / 部件层级清楚
适合场景：设计系统 / 组件规范 / 基础库
不适合：情绪品牌页 / 慢内容首页 / 沉浸发布页
推荐页面组织：工作台型 / Workbench / Tool Shell / 档案堆栈型 / Archive Stack
历史来源：包豪斯 / Bauhaus / 瑞士风格 / Swiss Style / 新字体排印 / New Typography
参考网站：Atlassian Foundations: https://atlassian.design/foundations/ / Carbon for AI: https://carbondesignsystem.com/guidelines/carbon-for-ai/ / People + AI Guidebook: https://pair.withgoogle.com/guidebook-v2/
配色系统：中性浅底或深底都可以 / 颜色要服务规则和部件区分 / 不要用品牌营销色压过系统信息
排版系统：层级像文档系统而不是品牌广告 / 术语、部件名和说明文字都要很好扫 / 标题克制但清楚
版式规则：foundation、component、pattern 要是一级入口 / 侧栏或分组导航必须稳定 / 规则页面要支持长期生长
图片处理：图例、tokens、组件截图和示意图都可以作为视觉证据 / 少用情绪化 hero 图 / 例子要比装饰重要
风格要求：Use a design system foundation family: foundations-first navigation, tokens and principles at the top level, restrained product-neutral visuals, strong left-rail or sectional hierarchy, and a page rhythm built around reusable rules rather than campaign storytelling.
历史来源 / Historical Roots
这部分放在最后看，用来补背景，而不是先决定风格。 / Use this section to add background after the direction is already clear.
1919-1933
包豪斯 (Bauhaus)
功能、工业和几何秩序优先。它把形式服从用途这件事系统化。
1950s-1970s
瑞士风格 (Swiss Style)
网格、对齐、无衬线、秩序感。它是今天大量知识型、设计型、档案型网页的基础语法之一。
1920s-1930s
新字体排印 (New Typography)
以非对称排版、空白场和摄影/版面组织信息清晰度。