Rarible

近黑色基底、网格布局与摄影展示。
页面以近黑色为基底,搭配白色文字。局部操作控件以黄色强调。字体采用 Geist Mono、Tomorrow。视觉特点包括网格布局、摄影展示。适合参考的场景:技术项目官网、区块链产品介绍页。
查看原始网站使用规范
建议采用
- 仅使用 #faff00 用于单一主要操作及激活/选定状态 — 每屏仅一个操作按钮,禁止使用其他颜色按钮。
- 所有 UI 文本、表格数据及按钮标签均使用 Geist Mono 400/500 以保留终端风格;仅在章节标题和展示标题中切换至 Tomorrow。
- 使用 1px #27272a 细线边框分隔不同表面,而非阴影 — 设计刻意保持扁平,依赖线粗来建立层级关系。
- 保持间距紧凑:相关元素间为 8px,卡片内为 16px,区块间为 32px。页面数据密集,而非空旷。
- 按钮、输入框和缩略图使用 6px 圆角;卡片和较大容器使用 12px 圆角;仅在胶囊开关和链选择器中使用 9999px 圆角。
- 表格中的所有数值数据右对齐,并使用 #faff00 表示正向百分比增长,负向增长使用柔和的粉色调 — 颜色用于编码数据,而非装饰。
- 页面画布和卡片表面默认使用 #0a0a0a;通过边框区分,或提升至 #18181b 以表示交互状态。
建议避免
- 不要引入第二个强调色 — 整个配色方案为单色,仅有一个翠绿主调。加入蓝色、红色或紫色会削弱品牌识别度。
- 不要为卡片、弹窗或悬浮面板添加阴影。系统采用扁平表面搭配细线边框;层级感来自叠加,而非模糊效果。
- 不要在矩形组件上使用超过 12px 的圆角 — 大圆角破坏了技术性、交易台的氛围感。
- 不要将正文文本设置为等宽无衬线字体。Geist Mono 是品牌标识;替换为 Inter 或系统默认字体将抹去市场空间的独特风格。
- 不要使用白色或灰色填充操作按钮,当意图表达‘主要操作’时 — 仅 #faff00 能传达此意。次要操作使用透明描边(透明描边)按钮。
- 不要在内容区域添加渐变、玻璃态或装饰性背景。画布始终为扁平的 #0a0a0a。
- 不要用颜色表示文本链接的悬停状态 — 依赖下划线或微妙的粗细/颜色变化至 #faff00,而非在行内文本上使用背景填充。