先认识包豪斯
包豪斯 1919 年由格罗皮乌斯在德国魏玛创立，是一所把艺术、工艺和技术结合起来的设计学校。它强调形式服从功能，用字体、色块和基本几何形建立清楚的秩序。
形式追随功能：基本几何形、三原色与网格，字本身就是图像。
适用场景与取舍
- 书店、咖啡店或文化项目的落地页：把介绍、活动与预约入口放进有比例差异的模块。
- 作品集与产品介绍：让标题、分隔线和图像共同建立层级，不依赖圆角卡片。
几何形应帮助导航与分组，不是越多越像包豪斯。长篇正文仍需舒服的行宽；混合表皮后，三原色可以换掉，但网格和字体秩序不变。
布局与字体怎么落到网页上
12 栏模块网格，所有元素对齐到栏线
- 标题巨大、左对齐，可以旋转 90° 竖放在侧边
- 用圆、方、三角三种基本形划分区域
- 色块直接承载内容，不靠阴影区分层级
- 4–8px 粗黑条做分隔
- 标题字体
- Jost · 700
- 正文字体
- Jost
- 中文回退
- "PingFang SC", "Noto Sans SC", sans-serif
- 界面形状
- 圆角 0（几何圆形作为图形可用）；边框 无描边，用色块和粗黑条分区；阴影 无
- 动效
- 机械、直接：形状平移或旋转 90°，没有回弹 · 200ms
包豪斯配色与质感
三原色各自成整块色面，承载内容或几何形；黑色只做粗分隔条和文字，不做描边色。
--bgoklch(0.96 0.012 90)--surfaceoklch(0.92 0.02 90)--inkoklch(0.18 0.01 260)--mutedoklch(0.42 0.01 260)--lineoklch(0.18 0.01 260)--accentoklch(0.53 0.21 29)--on-accentoklch(0.98 0.005 90)--accent2oklch(0.86 0.17 92)--accent3oklch(0.45 0.16 262)
质感：石版印刷的细颗粒，几乎察觉不到。流派原始强度 0.25；混合时取它与骨架 textureCap 中较小的值。只铺在背景，不盖住文字。
本项目调色板通过对比度校验；落到页面上仍要按实际前景与背景配对检查，不能把正文任意放在辅色上。
主视觉与生图媒介
母题：圆、方、三角三种基本形、粗黑分隔条、旋转 90° 的大标题。
英文媒介描述可以作为生图提示词的一部分，再补具体画面主题；完整构图与负向词请在工作台的“生图用”标签中取得。
Bauhaus lithograph poster, flat primary colors, geometric primitives, off-white paper
质感只铺在页面底色；主视觉单独占位，不作为正文底图。母题与骨架冲突时，只留在主视觉插图中。
代码提示词起点
下面是场景示例。需要完整 CSS 变量、布局规则和禁忌时，请在工作台复制“写代码用”提示词，或下载 DESIGN.md。
请为一家独立书店设计一个响应式网页。 骨架使用包豪斯：12 栏模块网格，所有元素对齐到栏线。 标题用 Jost，正文用 Jost。 表皮使用包豪斯：三原色各自成整块色面，承载内容或几何形；黑色只做粗分隔条和文字，不做描边色。 质感只放在背景，强度不超过 0.25；使用 3 个强调色。 不要改变骨架布局，不要让质感覆盖正文；保留键盘焦点和足够的文字对比度。
哪些搭配值得试
不要这样用
- 柔和阴影
- 大圆角卡片
- 居中堆叠的布局
- 渐变
- 装饰花纹
布局禁忌来自骨架，色彩与画面禁忌来自表皮；混合不取两套风格的平均值。