先给一个直接回答
先选一块承载正文的底色、一块形成结构的辅助色和一块标记重点的强调色。60/30/10可以作为第一张草图的面积起点，但它不是必须遵守的自然规律；阅读任务和图片本身都可能要求调整比例。
先分配任务，再挑喜欢的颜色
配色容易卡在“还差一个漂亮颜色”。更有效的起点是写下画面要完成的三件事：让人看懂主题、找到信息、识别下一步。底色负责给文字留空间，辅助色组织栏目，强调色只点出少量重要位置。这里的三色指三个视觉角色，不限制照片只能出现三种颜色。
本文采用一组原创练习色卡：米白 #F3EBDD、深青 #243F4A、赭橙 #C47742。它适合练习阅读页、课程卡片或植物观察笔记。三个名称仅帮助记忆，数值按sRGB数字画面理解，不代表真实纸张、油墨或任何品牌标准色。
两种面积方案怎样选择
下表中的百分比是可见大色块的粗略占比，不要求逐像素统计。先忽略文字细线，把页面缩小成几个块面，再判断哪个颜色占得最多。图片占满半页时，应把图片的大面积底色也算进视觉重量，不要只数按钮和背景。
| 方案 | 米白 / 深青 / 赭橙 | 适合练习 | 需要观察 |
|---|---|---|---|
| 均衡起稿 | 60% / 30% / 10% | 短海报、单张介绍卡 | 赭橙色是否抢过标题 |
| 阅读优先 | 80% / 15% / 5% | 长文、说明书、图文页 | 深青能否清楚划分层级 |
| 深色展示 | 15% / 80% / 5% | 少量文字的封面 | 浅色文字与图片边界是否清晰 |
把一张卡片做成两个版本
示例任务：制作一张“周末植物观察”练习卡，包含标题、80字说明和一个报名按钮。A版把赭橙色放在整条页眉、三枚标签和按钮上；B版只保留按钮为赭橙色，页眉回到米白，标签用深青细边。两版内容完全相同，先比较视线是否落在标题与按钮，而不是比较哪个更鲜艳。
- 建一个相同尺寸的画布，先用黑白排好标题、正文、图片和按钮。
- 加入米白底色与深青标题，确定正文在正常阅读尺寸下清楚可辨。
- 把赭橙只给一个重要区域，再复制画布制作第二种面积比例。
- 缩小观看整体，再放大读完正文；记录首先注意到的三个位置。
颜色多了，优先减哪一个
如果页面显得散，先检查是否每个小标题都换色、每个图标都高饱和、每张图片都带独立背景。把其中两类统一，往往比再加一个中性色更有帮助。需要多系列数据时可以增加颜色，但同时使用文字标签、线型或编号，让辨别任务不只依赖色相。
灰度预览适合发现明暗层级接近的问题，却不能替代文字对比度计算。赭橙可以用作装饰色块，但在米白底上的对比度约为2.92:1，不适合普通文字；白字放在赭橙底上约为3.46:1，也未达到普通文字4.5:1的阈值。最后检查真实字号、背景与按钮状态。若输出印刷品，按印厂要求转换文件并打样，不把屏幕上的HEX值当作印刷效果保证。
常见问答
60/30/10一定比其他比例好看吗？
不一定。它是便于分配视觉角色的练习框架。文字很多时可减少强调色，照片很强时可让背景更安静，实际比例由内容层级决定。
选了三个颜色，文字也只能用这三种吗？
不必。可为阅读加入接近黑色的正文色，并明确它属于文字功能色。比颜色数量更重要的是每种颜色都有稳定用途。
参考资料
下列资料支持文中的标准说明；站内色卡、版式与练习为七色堂原创示例。