配色

Color Palette

样式与 CSS也叫：色板、调色板、配色方案、主题色

一句话：界面使用的一整套颜色及用法规则，包括品牌主色、黑白灰中性色和表示成功、警告、错误的功能色。

详细解释

一套配色一般分三类：主色（品牌色，用在主要按钮、链接、选中状态）；中性色（一组深浅不同的灰，用在文字、边框、背景，占界面的绝大部分）；功能色（绿色表示成功、橙色表示警告、红色表示错误、蓝色表示提示）。每种颜色通常准备一组从浅到深的色阶，比如 50 到 900。

一个常用参考是 60-30-10：主导色（通常是中性背景）约占 60%，辅助色 30%，强调色只占 10% 左右，用在最需要注意的地方。颜色越多越乱，新手界面常见的问题就是用了太多鲜艳的颜色。

给 AI 提需求时直接给出色值，或者指定现成色板，比如「中性色用 Tailwind 的 slate，主色用 indigo」。

灰度线框示意，只表达结构，不代表具体视觉风格。

可以直接贴给 Cursor、Claude Code 等工具，把里面的业务内容换成你自己的。

请统一配色：主色 #2563eb，只用于主要按钮、链接和选中状态；文字和边框用灰色色阶，正文 #374151，辅助文字 #6b7280，边框 #e5e7eb；成功用绿色、警告用橙色、错误用红色；把这些颜色都定义成 CSS 变量。