58 lines
3.3 KiB
Markdown
58 lines
3.3 KiB
Markdown
# Theme Profile · sottsass（孟菲斯 / 80s 撞色）
|
||
|
||
> 这是给 **AI 写作时读** 的 authoring profile，不是 CSS。CSS token 由组件库
|
||
> 运行时主题持有（`data-theme="sottsass"`）。本文件是"如何选择和使用这个主题"。
|
||
> 详尽版本见组件库 canonical md：`src/theme/themes/sottsass/sottsass.md`（写代码 /
|
||
> 公式 / 媒体 / Raw 前请读它）。
|
||
|
||
- **runtime theme id**：`sottsass`（`<ThemeProvider theme="sottsass">`）
|
||
- **气质**：后现代 / 孟菲斯（米兰 1981）。暖奶油纸、黑墨，故意撞色的孟菲斯粉彩
|
||
（艳粉 / 青绿 / 阳光黄 / 钴蓝）。识别度来自 80s 游戏感：无模糊硬投影、轻微旋转、
|
||
圆角彩色药丸、波浪下划线、几何彩屑。响亮欢快但仍可读。
|
||
|
||
## 适合 / 不适合的文章类型
|
||
|
||
- **适合**：好玩的科普 / 解释、设计 / 文化 / 潮流写作、发布与活动稿、轻松上手；
|
||
"个性大于精致"、敢撞色不端着的内容。
|
||
- **不适合**：学术（`knuth`）、黑白大刊（`bodoni`）、冷调规格（`vignelli`）、
|
||
暗底工程（`shannon` / `fuller`）、严肃克制内容、安静治愈（`andy` 更柔）、幻灯片。
|
||
|
||
## 排版气质
|
||
|
||
- 标题 / 标签用 Space Grotesk（顽皮几何），正文用 Hanken Grotesk（干净 grotesque）。
|
||
- 正文 ~17px，行距 1.65；display 字重 700；强调不用斜体（协议级禁用），用色块 / 高亮。
|
||
- **撞色是表达、钴蓝是结构**：链接 / 序号固定钴蓝（可读）；粉 / 青 / 黄只作大胆填充，绝不作小字。
|
||
|
||
## Raw 风格
|
||
|
||
像一页孟菲斯海报式的图解。
|
||
|
||
- 约束的是**气质**（撞色块、无模糊硬投影、混合圆角、轻旋转、彩屑 / 波纹），不是**媒介**。
|
||
- 典型：硬投影卡片、撞色几何图、彩屑 / 波纹装饰、旋转标签、明快的比例 / 步骤图。
|
||
- 构图：黑描边 + 偏移硬投影 + 撞色 + 混合圆角；可轻微旋转。
|
||
- 动效：带回弹的弹入 / 位移；避免无限霓虹循环。
|
||
|
||
## 媒体（图片 / 视频 / 音频）风格
|
||
|
||
- 适合：几何彩屑插画、撞色海报、波纹 / 水磨石纹理、硬投影拼贴、明快人物 / 静物。
|
||
- 构图大胆撞色、可旋转 / 不对称、黑描边 + 硬投影；caption 简洁俏皮；必配 alt。
|
||
- 色彩粉 / 青 / 黄 / 蓝撞色 + 黑白；不用柔光渐变与霓虹。
|
||
|
||
## 代码 / 公式风格
|
||
|
||
- `CodeBlock` 像潮流杂志的代码卡片：暖浅 surface + 黑边 + 适度圆角，可有硬投影；不用暗终端。
|
||
- Prism token：标签 / 函数走钴蓝，关键字走红玫 risk，字符串走青 success；撞色在边框 / 高亮，不在语法色彩虹。
|
||
- `Formula` 可有圆角 surface 与一抹色，克制对齐。
|
||
|
||
## 禁止项
|
||
|
||
- 把粉 / 青 / 黄当正文 / 小字 / 链接色（可读结构固定钴蓝）。
|
||
- 柔光模糊阴影（本主题用无模糊硬投影）、廉价渐变、霓虹。
|
||
- "撞色 + 硬投影"用力过猛到读不下去（仍要保证正文从容可读）。用斜体强调（协议级禁用）。
|
||
|
||
## 不同信息密度下的表现建议（建议，非限制）
|
||
|
||
- `100% 好玩 explainer`：撞色长文 + 旋转章节块 + 硬投影 callout + 彩屑点缀，正文为主体。
|
||
- `60-80% 内容`：保留关键硬投影卡 + 撞色图解，波浪下划线点睛。
|
||
- `40% briefing`：Raw 偏撞色比例 / 步骤图，文字更短，仍是孟菲斯形态。
|