01
先看图挑方向
先按极简、科技、工艺、个性、出版、工具这些直觉标签筛一遍。
关于 / About
这不是设计史百科。 它是你的建站选型工具。
这个站解决的不是“设计风格叫什么”，而是“我现在要做一个网站，先选哪种方向，接下来怎么交给 AI 做出来”。
首页负责看图和缩小范围，浏览页负责比较，详情页负责拿 Prompt；而 design.zondev.top 只做整个设计生态的总入口，不再重复这些深内容。
使用方式 / How It Works
看图选风格，拿 Prompt 建站 / Choose by image, then build with prompts
这四步才是这个站真正的服务链。
02
打开单个风格详情
确认它长什么样、适合做什么、不适合做什么。
03
复制 Prompt 或下载 Skill
把风格规则带走，直接喂给 Codex / Cursor / Claude。
04
再回来补历史来源
历史流派留到最后看，用来理解源头和避坑，不抢首页入口。
当前网页方向 / Current Web Signals
现在主流网站大致分成这些方向 / How current websites are clustering now
这层不是历史流派，也不是工程底座。它回答的是：今天大家实际做出来的网站，大致正在往哪些方向收敛。
当前信号 / Current Signal
编辑出版 (Editorial Publishing)
封面式首屏、图文主导、栏目节奏明确，适合内容品牌、文化媒体和专题型首页。
当前信号 / Current Signal
黑白网格 (Black-and-White Grid)
排印主导、克制留白、项目索引清楚，是工作室、档案站和参考库最稳定的一条当代方向。
当前信号 / Current Signal
机构项目 (Institutional Programs)
介于文化机构首页、项目计划网和展讯入口之间，重点是同时容纳栏目、program、活动与档案。
当前信号 / Current Signal
开发者平台 (Developer Platforms)
产品说明、可信性能、文档邻接和生态证明同时出现，是 2025-2026 年非常稳定的一条技术网页方向。
当前信号 / Current Signal
模板与发现市场 (Template Discovery)
截图优先、分类清楚、拿走路径短，既是一种站型，也是一整套分发生态。
当前信号 / Current Signal
工业硬件极简 (Industrial Hardware Minimal)
物体、材质和体块比长解释更重要，适合消费电子、设备旗舰页和工业设计品牌。
当前信号 / Current Signal
文化品牌零售 (Editorial Commerce)
内容、刊物、会员和精选物件混在同一品牌世界里，靠目录感和策展感而不是促销噪音完成转化。
当前信号 / Current Signal
系统文档 (System Docs)
设计系统、组件规范、tokens 和 guideline 入口正在变成一类很稳定的网页语言，不再只是产品文档的附属页面。
当前信号 / Current Signal
创作网络 (Creative Networks)
作品发现、作者身份、收藏和社交证明组合在一起，是创意社区与公开 portfolio platform 的稳定形态。
当前信号 / Current Signal
服务清晰 (Service Clarity)
plain language、任务入口和规则文档的组合越来越稳定，尤其适合公共服务、流程站和高可信知识入口。
当前信号 / Current Signal
模块化 AI 发布 (Modular AI Launches)
hero + bento 卡片 + 产品演示已经成为近一两年 AI 产品和 startup 首页里非常常见的一条方向。
当前信号 / Current Signal
空间与事务所 (Space And Practice)
建筑、空间、文化 practice 与 identity archive 之间正在共享一套更安静、更留白的 project-led 语言。
当前信号 / Current Signal
零售与场景品牌 (Retail And Scene Brands)
零售、酒店、生活方式和文化品牌越来越依赖场景摄影、安静目录和低噪声转化来建立高级感。
当前信号 / Current Signal
图像出版 (Image-Led Publications)
摄影期刊、奢刊和文化出版更依赖封面、图像比例和 issue 节奏，而不是普通资讯站的栏目密度。
当前信号 / Current Signal
专家知识市场 (Expert Learning)
课程平台、creator education 和 cohort course 正在形成一类介于 marketplace、媒体和知识产品之间的稳定网页语言。
当前信号 / Current Signal
AI 原生网页 (AI-Native Web)
agent 产品、开源开发者工具和研究实验室正在形成更鲜明的 AI 原生站型，不再只是旧 SaaS 模板换一个词。
当前信号 / Current Signal
可信与照护 (Trust And Care)
金融、公共服务与健康产品都在强调可读、可信和完成路径，只是情绪温度和行业证据各不相同。
公开 Skills 仓库 / Public Skills Repo
每个风格都有对应的可下载 Skill / Each style has a downloadable skill
网站负责浏览、选型和说明；公开仓库负责把每个风格的 Skill 单独保存、同步和开放下载。
仓库按风格分文件夹维护 SKILL.md。你可以先在站内看图选方向，再去 GitHub 拿对应 skill；也可以直接把 skill 放进 Codex / Cursor / OpenClaw 的 skills 目录复用。
仓库内容 / Repo Contents
- 每个风格一个独立 slug 与 SKILL.md
- 和站内详情页一一对应
- 通过 npm run build && npm run export:skills 同步
- 适合直接给 AI 当风格约束包
类似站点与开源路径 / Comparable Sites and Open-Source Paths
外面已经有哪些成熟做法 / What already exists outside this atlas
这一页不再把它们做成一堵同尺寸卡片墙，而是按“能借什么”来分组列出。
外部参考 / External Reference
灵感图库 (Curated Galleries)
这一类最接近你的浏览页目标：先看截图，再按标签、类型或场景筛。多数不是开源，但非常适合借首页组织、分类方法和浏览节奏。
-
首页把最新、获奖、合集和分类入口并列摆出来，适合借它的强入口组织。
-
非常克制、图像优先，适合借它低噪声的 image-first 浏览方式。
-
筛选维度很丰富，尤其适合借行业、风格、版式与 section 的交叉筛法。
-
最适合借给选型器和下钻流程：从 Screens 到 Flows 的层级非常清楚。
-
popular categories、styles、types 和 subjects 并列呈现，很适合借它的前台发现入口与分类语言。
-
截图优先，并把网站、模板、工具放在同一套浏览入口里。
-
把 styles 和 types 都做成明确分类页，适合借它补“风格名”和“站点类型”之间的桥梁。
外部参考 / External Reference
官方趋势来源 (Official Trend Reports)
这一组不是风格库，而是近一年主流建站平台自己总结的方向。适合补“现在网页普遍往哪走”，再回到站内匹配更稳定的风格家族。
-
把 AI 辅助、沉浸式 3D、实验导航、暗色模式、可访问性与可持续这些高频方向放在同一张趋势图里，适合做总览入口。
-
更偏落地网页效果：滚动驱动、微交互、空间感和更强表达性的首屏语言，适合补“这些趋势实际会长什么样”。
-
补上更品牌、更生活方式的一面：表达型字体、有机形态、手绘/拼贴和发光视觉，能帮助区分“趋势信号”和“稳定家族”。
外部参考 / External Reference
模板市场 (Template Marketplaces)
这一组回答的是“现成模板和资产在哪里分发”，它们是生态和商业路径，不该假装成单一风格。
-
模板、行业、组件和价格路径非常清楚，适合借它的 browse-to-take 节奏。
-
更贴近当前建站人群，模板、sections 和插件的并置方式很值得借。
-
分类、标签、封面和使用场景说明同时成立，是模板站视觉与转化都很成熟的一类。
外部参考 / External Reference
设计系统 (Design Systems)
这一组回答的是“这种网站怎样系统化落地”，更接近规则、组件、模式和治理，而不是风格名词。
-
产品系统、AI 指南和可访问性并存，很适合补 style -> system -> example 这条链路。
-
把 Brand、Product、Accessibility 分开组织，是视觉层和系统层拆分的好例子。
-
从 foundations 到 components 到真实站点示例都很清楚，适合借它的文档架构。
-
更完整的系统型站点案例，roadmap、docs、community 分层很清楚。
-
更偏大型产品组织的设计系统表达，适合借其模式、组件和文档之间的关系。
-
把系统、书、文章、工具和 talks 都做成资源库，适合作为系统层的延伸入口。
外部参考 / External Reference
组件底座 (Component Foundations)
这一层回答的是“交互和组件具体怎么做”，属于工程与实现底座，不应该被混写成视觉风格。
-
最值得借的是 example-led docs 和 copy-to-use 的交付方式，不是它的默认视觉。
-
适合补稳定的无头组件层，让视觉和交互实现彻底分开。
-
更偏可访问性和交互行为层，适合补复杂控件的实现参考。
-
更偏底层组件语义、部件、状态和行为研究，适合做交互层参考。
-
它不是风格，但非常适合回答“组件怎样被展示、测试和复用”。
-
更接近当代组件与 blocks 生态，适合补“如何快速实现一个方向”的资源层。
外部参考 / External Reference
历史档案 (Historical Archives)
这一类更接近你时间轴与历史流派的外部参照。重点不是模板，而是历史演化、年代感和视觉源流。
-
最接近“设计流派时间轴”的外部参照，年代和风格切得很清楚。
-
更像设计研究馆藏，适合借 archive、essay、collection 混合的组织方式。
-
馆藏检索、分类和开发者入口都很完整，适合借 serious archive 的信息架构。
-
大型博物馆藏品浏览与筛选的成熟案例，适合借浏览层的深度分组。
-
把旧网站、Flash、App、软件和展览都纳入同一套历史档案里，更偏 web 历史视角。
-
如果你想把风格 atlas 做得更像可检索档案，Fonts In Use 的元数据密度尤其值得借。
外部参考 / External Reference
数字馆藏框架 (Collection Frameworks)
如果你之后要把 atlas 做成数字馆藏、策展档案或研究收藏站，真正能落地的底座通常在这里。
-
如果要把你的站做得更像策展档案馆，collection / exhibit 结构非常值得借。
-
适合把截图、元数据、时间轴、地图和主题页做成静态数字收藏网站。
外部参考 / External Reference
开源设计社区 (Open Design Community)
这一层更像社区、索引和参与路径，补的是资源聚合与贡献机制，而不是具体页面长什么样。
-
社区、资源、文章和贡献路径组织得很成熟，适合借社区型资源站的架构。
-
组件、系统、代码示例和开源状态在同一条检索链里，特别适合补 style -> system -> example 的链路。
-
如果你要把站做得更像开放资源库，它的资源组织和延伸阅读很值得借。
历史流派 / Historical Timeline
时间轴还在，但不占首页入口 / The timeline still exists, but no longer owns the homepage
当你已经选到一个方向，再回来补历史演化、视觉特征和网页里的延续关系。
完整的历史流派页会给你更大的年份展示、更完整的视觉特征和对应网页影响，不再挤在 About 里和服务说明抢注意力。