Krisp

暖白色基底、渐变展示与细线分隔。
页面以暖白色为基底,搭配深蓝色文字。字体采用 Plus Jakarta Sans。视觉特点包括渐变展示、细线分隔、摄影展示。适合参考的场景:AI 工具官网、产品能力介绍页。
查看原始网站使用规范
建议采用
- 默认页面画布使用 #f2ece2(Warm Paper),根层不替换为纯白。
- Iris Spark 至 Cyan Glow 渐变仅用于展示尺寸标题(42px+),不用于正文或普通标题。
- 所有按钮和小型交互元素采用 8px border-radius,卡片为 16px,胶囊形控件与标签页为 9999px。
- #131032(Midnight Iris)同时用于浅色表面上的文字和深色分区的背景;两种场景体现同一品牌身份。
- 以填充区分操作按钮样式:一种使用 Iris Spark(#614efa),另一种使用 Slate(#1a1a22);不要并列两个紫色按钮。
- 卡片边框与分隔线采用 1px Hairline(#e7e7ea);以表面颜色变化建立抬升,而非阴影。
- 辅助正文颜色只用 #918f9f(Fog);主要文案不使用 Ash(#a1a1aa)。
建议避免
- 不要引入新的饱和颜色;Iris Spark 是唯一鲜明色相,每个视口最多出现 1-2 次。
- 卡片或面板不要添加投影;Warm Paper 画布上的表面变化就是抬升体系。
- 文字不要用纯 #000000;Midnight Iris(#131032)承载品牌底调。
- 白色背景上不要叠白色卡片;Snow(#ffffff)始终叠在 Warm Paper(#f2ece2)或 Cloud(#f7f7f8)上以形成区分。
- 正文、普通标题或副标题不使用渐变;渐变处理仅用于展示标题。
- 按钮的 border-radius 不超过 8px;8px 圆角而非胶囊形是按钮的标志性特征。
- 客户标志不要显示全彩;须弱化为灰阶或灰色,维持安静编辑感。