网页设计规范与技巧手册（执行版）.docxVIP

网页设计规范与技巧手册（执行版）

第1章基础色彩与字体规范

1.1主色调体系定义

主色调（PrimaryColor）是网站视觉系统的核心灵魂，通常定义为品牌色或主功能按钮色，需严格遵循品牌视觉识别系统（VI）标准。例如，若品牌色为深海军蓝（003366），则全站按钮、及卡片背景应统一使用此颜色，确保用户在任何场景下都能迅速识别关键交互元素，建立品牌信任感。主色调的数值定义必须精确到四位十六进制码，避免使用模糊描述如“蓝色”或“深蓝色”。设计师需根据品牌手册提取或开发确定的HEX、RGB或HSL值，并在代码中通过CSS变量统一管理，防止因环境色变化导致颜色不一致。

主色调的语义权重需明确区分“主色调”与“强调色”，主色调仅用于基础构建（如背景、边框、按钮），而强调色（AccentColor）则用于引导用户注意力（如悬停状态、焦点框）。例如，将主色调设为2563EB（蓝色），强调色设为10B981（绿色），通过冷暖对比实现功能区的视觉分层。在主色调体系中，需明确定义“禁用状态”的颜色，即当主色调不可用时（如按钮被、失效）应显示为高对比度的中性色（如F3F4F6灰色）。这种设计原则能防止用户因颜色变化产生困惑，提升交互的稳定性与可预测性。主色调的色值选择应基于色彩心理学原理，例如针对金融类网站，主色调宜选用冷色调（如1E3A8A）以传递专业、冷静、可信