Dribbble

近白色基底、网格布局与圆角卡片。
页面以近白色为基底,搭配近黑色文字。字体采用 Mona Sans。视觉特点包括网格布局、圆角卡片。适合参考的场景:设计作品集、创意服务介绍页。
查看原始网站使用规范
建议采用
- 仅在品牌锚定场景中使用 #ea4c89:搜索提交、PRO 标签、标识 标记、心形填充、每页一个高亮。禁止在大区域上使用品红色。
- 将填充型主要按钮设为 #0d0c22 填充色,白色文字,8px 圆角,10px 18px 内边距,Mona Sans 14px 字重 600。
- 导航栏设定为 64px 高的 #060318 色带,文字使用 Mona Sans 14px 字重 500,白色,禁止添加阴影或底边框。
- 首屏区域标题使用 Mona Sans 48px 字重 700,行高 1.08;其余内容则提供视觉分量。
- 保持 4 列缩略图网格位于纯白画布上,图片圆角 8px,元数据间距 12px——不要卡片背景、阴影或单元之间的分隔线。
- 将 PRO 标签渲染为 #ea4c89 填充色,白色文字,4px 圆角,9px 字重 700 大写,与设计师姓名并列显示。
- 内容区块之间保持 40px 间距,同一拍摄卡片内元数据项之间保持 8px 间距——节奏应显得密集但透气。
建议避免
- 不要在正文、图标、边框或大面积填充中使用 #ea4c89——过度使用会使其失去意义。
- 不要为卡片、按钮或导航添加阴影——系统依赖色彩对比和 8px 圆角来建立层级关系。
- 不要使用除 Midnight Ink 或 Deep Plum 之外的任何颜色填充深色按钮——避免使用 #3d3d4 作为主要 CTA 按钮。
- 不要在标准 UI 元素上使用超过 16px 的圆角——缩略图为 8px,首屏区域为 16px,任何更圆的形状都会显得不恰当。
- 不要引入第二个强调色——配色方案为单色系加一个品红色,增加第二个强调色会削弱品牌识别度。
- 不要将正文文字设置在小于 12px 或大于 16px——系统在 13–14px 时压缩信息,仅保留 48px 用于首屏区域标题。
- 不要在深色导航中使用渐变、发光或透明效果——保持为纯色 #060318 色带。