Function

温暖的药房风格羊皮纸期刊
Function 阅读起来像是一本高端的健康类编辑期刊,印刷在温暖的奶油色纸上:一种衬线字体(Financier)用于标题,以沉稳的权威感呈现,而一种人本无衬线字体(Ftbase)则传递出冷静医生般的体感。整个视觉基调从不采用纯白——每个表面都处于温暖的羊皮纸色系范围内,从 #fef9ef 到 #f5eee1,且仅用一个赭石色点缀(#b05a36)来强调操作、徽章和图标笔画,如同药房标签上的蜡印。组件采用 宽松 的圆角(24px 卡片,40px 按钮,9999px 胶囊形控件),但从未显得幼稚,因为阴影使用极为克制,仅限于两个层级。同一标题中混合使用斜体衬线与罗马衬线,形成独特的排版节奏,这是该系统的最强特征——健康科技,相信读者能放慢节奏。
查看原始网站使用规范
建议采用
- 所有编辑类标题均使用 Financier Display,每行内必须同时搭配罗马体与斜体权重,以形成标志性的排版节奏
- 正文与界面文本统一使用 Ftbase,全局采用 -0.023em 字间距,任何元素均不得单独覆盖或修改
- 默认采用米色表面堆叠(羊皮纸 → 老式纸张 → 深灰轮廓)来营造层次感,避免过早使用阴影
- 所有按钮统一使用 40px 的圆角,所有卡片使用 24px 的圆角——矩形形状会破坏系统的整体身份
- 将 #b05a36 严格限定为三种用途:主要的行动按钮、眉题标签以及激活/选中状态——绝不可用于正文或大面积背景填充
- 在列举项目(如疾病或分类)时,使用 16px 水平间距的赭石色 圆点 '·' 作为列表符号
- 首屏摄影保持温暖色调,并叠加深色叠加层,以确保白色或羊皮纸色标题在视觉上可读
建议避免
- 禁止使用纯白色(#ffffff)作为背景——这会破坏品牌标志性的羊皮纸暖感
- 正文部分不得使用除 Ftbase 以外的任何字体;衬线字体仅用于编辑类标题
- 禁止使用尖锐的纯黑阴影;层级感必须通过色彩渐变或两种获批的阴影配方实现
- 禁止将赭石色用于大面积背景、装饰性区块或文本尺寸超过 24px 的区域——未稀释时会显得过于突兀
- 避免使用矩形按钮或方形卡片角;必须坚持使用圆角家族(40px / 24px / 9999px)——这是不可妥协的规则
- 禁止引入第二个辅助色——该系统为单色温暖调,仅含一个赭石色点缀,引入第二色会破坏药房氛围
- 禁止在衬线字体 Financier Display 上使用 -0.023em 字间距——该字间距仅属于 Ftbase