SONGSHU · BRAND SYSTEM 01

松果任务板

为 3–10 人小团队设计的清晰、可靠、带一点温度的任务协作界面。视觉重点是“快速看懂、轻松推进、按时交付”。

01 · 色彩

#176B52

主要行动、选中态、品牌识别。白字对比度 6.44:1。

#B45F18

提醒、焦点环、少量强调。白字对比度 4.57:1。

#F7FBF8

页面背景，降低大面积纯白带来的刺眼感。

#173B35

标题与正文。对画布对比度 11.74:1。

主色只承担主要操作与状态，不用于大段文字背景。

辅色用于提醒和键盘焦点，不替代错误色或成功色。

边框使用 #C8D9D2；禁用态降低饱和度，但保留可辨识轮廓。

按 WCAG 2.2 相对亮度算法计算；普通文字 AA 要求 4.5:1，大号文字 AA 要求 3:1。以下为本次 token 的实测结果。

组合	前景 / 背景	比值	结论
正文 / 画布	`#173B35 / #F7FBF8`	11.74:1	通过 AA
次要文字 / 白色表面	`#55706A / #FFFFFF`	5.37:1	通过 AA
主按钮文字 / 主色	`#FFFFFF / #176B52`	6.44:1	通过 AA
悬停按钮文字 / 悬停色	`#FFFFFF / #0F513E`	9.26:1	通过 AA
强调按钮文字 / 强调色	`#FFFFFF / #B45F18`	4.57:1	通过 AA
危险文字 / 白色表面	`#A83232 / #FFFFFF`	6.63:1	通过 AA

我的任务

本周待办

把复杂的工作拆成下一步就能执行的任务。

负责人 · 截止日期

更新于 2026/11/07 09:30

字体优先使用 Inter；中文回退到系统黑体。不要使用全大写、负字距或低于 12px 的正文。行高保持 1.4–1.5，帮助用户快速扫描任务列表。

4 · 4px

8 · 8px

12 · 12px

16 · 16px

24 · 24px

32 · 32px

采用 4px 基础间距。任务卡内部使用 16px；区块之间使用 32px；页面主内容左右至少 24px，桌面端建议 32–64px。信息密度优先于装饰。

按钮高度 40px、水平内边距 16px、圆角 8px。键盘焦点必须使用 3px 琥珀色外框并留 2px 间隙；不可只依赖颜色变化。

小图标 16px；默认 20px；大图标 24px。图标与文字间距 8px，按钮内垂直居中。

使用 1.75px 描边、圆角端点、低细节图形。优先使用 Lucide 等一致的线性图标；不要混用填充和描边风格。

删除使用危险红 #A83232；默认图标使用 #35635A。图标按钮必须有可访问名称和悬停提示。