文档优先开源产品 (Docs-First Open Source Hybrid)
更像 Supabase、Astro、Bun 这类文档优先的开源产品首页，重点是安装路径、文档邻接、代码可信和社区证明，而不是重 marketing 氛围。
开源产品framework 官网开发者工具
真实网站参考 / Real References
先看这些真实网站 / Open these real sites first
长这样 / Looks Like
- get started 很近
- 文档邻接
- 代码可信
- 社区证明明确
适合做 / Good For
- 开源产品
- framework 官网
- 开发者工具
不适合做 / Not For
- 纯大片品牌页
- 无文档入口的营销站
- 情绪型杂志首页
Skill 包含什么 / What The Skill Controls
截图、排版和规则来自同一套风格包 / The screenshots, layout, and rules come from the same skill packet
配色系统 / Color System
- 中性深浅都可以
- 强调色要服务安装和导航
- 不要用营销色覆盖开发者判断
排版系统 / Typography
- 大标题直接说明是什么
- 安装、文档、社区这些词要单独成层
- 代码或命令提示要很好扫
版式规则 / Layout Rules
- 首屏先给 get started
- 文档和产品说明紧邻出现
- 让社区、stars 或生态证明自然入场
图片处理 / Image Treatment
- 界面、代码和架构图都可作为证据
- 少用纯情绪摄影
- 首图要说明产品形态而不是只定 mood
交互节奏 / Motion
- 交互反馈清楚就够
- 避免娱乐化镜头动效
- 让结构和可信感先成立
AI Prompt / AI Prompt
复制后直接粘贴给 Cursor / Claude / Paste directly into Cursor / Claude
请参考文档优先开源产品（Docs-First Open Source Hybrid）风格建站：
视觉特征：get started 很近 / 文档邻接 / 代码可信 / 社区证明明确
适合场景：开源产品 / framework 官网 / 开发者工具
不适合：纯大片品牌页 / 无文档入口的营销站 / 情绪型杂志首页
推荐页面组织：工作台型 / Workbench / Tool Shell / 专题长文型 / Dossier / Feature
历史来源：包豪斯 / Bauhaus / 瑞士风格 / Swiss Style / 极简主义 / Minimalism
参考网站：Supabase: https://supabase.com/ / Astro: https://astro.build/ / Bun: https://bun.sh/
配色系统：中性深浅都可以 / 强调色要服务安装和导航 / 不要用营销色覆盖开发者判断
排版系统：大标题直接说明是什么 / 安装、文档、社区这些词要单独成层 / 代码或命令提示要很好扫
版式规则：首屏先给 get started / 文档和产品说明紧邻出现 / 让社区、stars 或生态证明自然入场
图片处理：界面、代码和架构图都可作为证据 / 少用纯情绪摄影 / 首图要说明产品形态而不是只定 mood
风格要求：Use a docs-first open-source family: show install or get-started cues early, keep docs and code proof near the hero, make community credibility visible, and let structure and developer trust do more of the persuasion than glossy brand theater.
历史来源 / Historical Roots
这部分放在最后看，用来补背景，而不是先决定风格。 / Use this section to add background after the direction is already clear.
1919-1933
包豪斯 (Bauhaus)
功能、工业和几何秩序优先。它把形式服从用途这件事系统化。
1950s-1970s
瑞士风格 (Swiss Style)
网格、对齐、无衬线、秩序感。它是今天大量知识型、设计型、档案型网页的基础语法之一。
1960s-1970s
极简主义 (Minimalism)
把形式削减到最少元素，让结构、比例与重复本身发声。