# 暖肉色对照 · 2026-09-28

用户授权：保留绿色版本，探索更亲近肉类、更有食欲的肉色/红色。首轮首页、商品详情、我的，以及鼎形商标试色；不是新品牌定稿，不改后台或既有九站顺序。

## 入口

- `/color-study`：同一手机视窗切换绿色/暖肉色，页面快捷入口及商标样张都在手机框外。
- `/warm`：独立暖肉色应用。
- `/origin`、`/phone?composition=origin`：现有绿色版不变。

方向：大面积暖骨白，浅肉桃色组织规格和信息面，深胭脂色承担选择与行动，暖墨褐支持阅读。保持食物最有色彩，不做红黑促销、不铺满粉色、不改变食品摄影。

## 实现与边界

`warm-theme.mjs`从原CSS生成色彩衍生：只映射黄绿至叶绿区间的色值，保留明度层级、透明度与所有布局声明。`warm.css`单独调整暖纸底、SKU色面、我的深红和商标显示滤镜。照片无滤镜，只有商标做CSS试色，不是新的PNG/模型定稿。

比较入口共用同一iframe，切色更换样式表，不重载React、不重置SKU。页面快捷入口通过原型真实按钮导航，不增加业务写入；跨页面仍遵守原应用状态行为。两入口共享本浏览器模拟存储，不是独立账本。

平衡：保留原有点阵、边界、磨砂与阴影几何；少量辅助文字回到暖灰，避免处处泛红。计划等其他页面仅接受色彩传播，本轮不宣称完成全套暖色精修或状态颜色语义审查。

## 评审问题

1. 是否更想选肉，而不是只觉得换了颜色？
2. 是否变甜腻、闷热、像促销，或失去干净感？
3. 暖红是否仍传达可靠，而非紧迫？
4. 暖赤陶商标是否融入，还是让人想到金属/器物？

维护与回退：删除或停用独立暖色入口即可，不需要恢复绿色资产。Foundation保持provisional；待用户比较后再决定是否扩大到全品牌/后台。跨浏览器、真机、对比度完整验收仍未完成。

验证脚本：`color-study.test.mjs`，需要Playwright。检查绿色基线与Git HEAD字节一致，三页切色时几何/内容/选中项与食品图像不变，颜色实际改变，四档宽度无整页溢出，独立入口正常且无页面/HTTP错误。

本轮上述检查已通过；首页、详情、我的均完成截图查看。曾发现快捷入口直接click不能触发原组件的Tab切换，现已使用其鼠标按下事件并验证从详情返回后可进入我的。首次切色避免重复加载同一CSS，防止重复load触发。

## 第二轮：先区分职责，再分配红色

反馈：首轮图标、按钮的颜色明暗缺乏层次，未保留绿色版的精致感。判断：单纯按原色相转成红色，混淆了阅读、辅助入口、选中反馈和主要行动的职责。

取舍：不整体提高饱和度或统一压暗；基础映射转为低饱和暖中性色，语义选择器单独负责强调。正文暖墨褐，辅助图标灰褐；选中规格采用奶白承托、深胭脂文字和微弱暖影；主要行动才使用深红色面。首页保留食物的色彩中心；我的以深胭脂、矿物砂色、纸白三层衔接身份、订单与日常入口。保留原磨砂、点阵、阴影位置和全部几何，不增加装饰负担。

验证：三页截图人工检查；切色时内容、几何、食品照片和选择不变；绿色基线字节比较、四档宽度与独立入口检查通过。补充自动断言：导航激活/未激活色不同，克重和切法选中色一致且与普通项不同。此证据不等同于全站无障碍验收；计划和次级流程仍需后续逐页审查。

维护责任：本轮原型配色迭代承担者维护独立暖色覆盖层；是否采用由用户对照评审决定。若暖砂过重或深红带来压迫，优先收敛色面，不改布局；随时切回绿色入口，原文件未被替换。