品牌识别
如何使用 bikedo.app 品牌。
字标、配色、字体以及我们谈论产品方式的简短指南。如果你在合作伙伴网站、媒体素材包或社区帖子里使用 BikeDo 的素材,这里就是依据。
字标
两色、两个字重、一个 Clay 强调。Inter Black,字间距略收紧。
黑色背景
浅色背景
单色(最后选择)
小尺寸(favicon / 应用图标)
字标始终为 「bikedo.app」(小写)。「.app」后缀始终为 Clay。
字标周围的留白至少为「b」字高的距离。不要挤压。
在正文中将产品写作 BikeDo(CamelCase)— 切勿写「BikeDo App」或「BikeDo API」。
图标
应用标志 — 深色方块上 Clay 色的小写「b」。同一个标志可用作应用图标、网站图标,以及页脚或签名中的图标。
不要改色、拉伸或旋转标志。保持比例和留白。
图标已内置深色背景 — 不要在另一个深色方块上无间距地放置。
壁纸
品牌配色的桌面壁纸 — charcoal 上的标志,5K。可选纯标志或带标语版本。
手机版



社交 / 分享
配色
以峡谷为灵感。一个暖色强调(Clay),两个深色,两个中性,两种文本色。每个颜色都有定义好的角色 — 保持在该轨道。
Clay
#C45E3A主强调色。CTA、链接、焦点环、激活状态。绝不用作页面背景。
Black
#1A1A1A页面背景(深色界面)。移动 App 与 Web 的默认底色。
Charcoal
#2D2D2D深色界面上的卡片/面板背景。比 Black 略亮。
Stone
#4A4A4A深色界面的边框、分隔线、细线。降到 30–60% 透明度作为柔和分隔。
Text light
#F5F5F5深色界面的主文字。Black/Charcoal 上的标题与正文。
浅色 — 与 Charcoal 或 Black 文本搭配。
Text muted
#78716C次要文字、说明、提示、占位符。在 Black 上满足正文尺寸的 WCAG AA。
Sand
#E8DED5浅色界面(营销、样机)的边框。与 Light bg 搭配。
浅色 — 与 Charcoal 或 Black 文本搭配。
Light bg
#F8F6F3浅色主题与样机的灰白色。不使用纯白。
浅色 — 与 Charcoal 或 Black 文本搭配。
字体
产品与正文使用 Inter。营销页面的编辑标题使用 Playfair Display。不要混用 — 一个界面一种角色。
UI + 正文
Inter
敏捷的棕色狐狸跳过懒狗
编辑标题
Playfair Display
敏捷的棕色狐狸跳过懒狗
H1 — Playfair, 48–60px
为你的自行车打造更简单的家。
H2 — Playfair, 28–36px
无需电子表格的维修历史。
正文 — Inter, 16–18px
两次点击即可记录一次保养。加张照片。分享给车店。当车辆易主时,完整的历史会随车流转。
说明 — Inter, 12–13px
上次保养于 14 天前 · 1,240 公里
语调
BikeDo 像一个懂自行车、平静且专业的朋友。自信、具体、不浮夸。我们不喊话。
建议
将字标作为「bikedo.app」使用,「.app」用 Clay。
配合 Inter Black/Bold 并保留呼吸 — 至少留出「b」字高的留白。
在正文里把产品写作「BikeDo」(CamelCase)。
句中 CamelCase 比小写字标更易读。
Clay 要克制 — Black/Charcoal 页面上唯一的强调。
如果一切都强调,那就没有强调。Clay 应把目光引向下一步操作。
标题与按钮使用句首大写(sentence case)。
句首大写更像在说话,而不像企业产品。
避免
正文中不要写「BikeDo App」「BikeDo Mobile」或「BikeDo API」。
它就是 BikeDo — App 与 API 是实现细节,不是名称的一部分。
不要更改字标的颜色分配。
「bikedo」在深色背景始终用 Text light(浅色背景用 Charcoal);「.app」始终用 Clay。
不要让 Clay 叠在 Clay 上,也不要给「.app」后缀重新着色。
会失去固定品牌的辨识信号。
不要用纯白作为背景。
使用 Light bg(#F8F6F3)。纯白在土质色板旁显得冰冷。
不要把 tagline 与字标并排锁定。
如果需要 tagline,请放在字标下方独立一行,使用 Text muted。






