
Mercury
黄昏时分的阿尔卑斯山坡
Mercury 的设计风格融合了阿尔卑斯山的银行美学:近乎黑色的底色 (#171721) 营造出一种电影般的、天文台般的氛围,内容表面如同略浅的石墨卡片般漂浮其上。界面以单色为主——象牙色文字搭配缟玛瑙色背景,仅有一个醒目的钴蓝色 (#5266eb) 元素专门用于核心的“开户”操作。字体是主要的表达方式:自定义的 480 字号显示字体(既非粗体也非细体)与 400 字号的柔和正文字体搭配,打造出一种自信而不张扬的风格。组件采用扁平化设计,无边框,依靠 12 像素的石墨卡片半径和胶囊形控件来定义结构,而非阴影。占据整个页面的主图元素——雾气缭绕的山峦映衬着一张孤零零的桌子——在用户界面启动之前便奠定了基调,而后续的每个元素都延续了这种静谧而高级的暗色调。
所有内容均采用深色全宽设计风格。主屏幕为一张 100 像素的全宽图片,居中显示标题、副标题以及用于收集电子邮件联系信息的表单模块(最大宽度约 640 像素)。主屏幕下方,内容以最大宽度 1200 像素、垂直边距 72 像素的版块形式组织,交替采用左侧文字右侧图片的双栏布局和三栏产品描述卡片布局。导航栏为透明的顶部栏,叠加在主屏幕上,滚动页面时会逐渐过渡为类似磨砂玻璃的深色背景(背景模糊)。页脚为深色,包含注释文字。垂直方向布局舒展,版块之间留有足够的空间。没有侧边导航;所有导航均位于顶部栏中。
主界面以全幅电影级照片为主,展现出氛围浓郁、令人心旷神怡的风景(云雾缭绕的山峦、静谧的自然工作空间),将银行业务描绘成一种沉思冥想、超凡脱俗的体验。照片质量上乘,色彩饱和度略低,色调偏冷,并略加暗色叠加,以确保文字清晰易读。主界面下方,图片与产品用户界面截图和抽象的氛围背景交替出现。界面中没有插图,也没有艺术感十足的图标——所有视觉元素要么是照片,要么纯粹是功能性的。整个用户界面的图标风格简约,采用象牙色线条/字形设计,应用于导航、按钮和表单元素。
调色板
品牌
- Cobalt
#5266eb— 紫色用于填充按钮、选定的导航状态和焦点驱动的转化时刻。
中性的
- Onyx Canvas
#171721— 主页背景、主屏幕基本叠加层、页脚和各部分的画布。 - Graphite Card
#1e1e2a— 纸板和各部分的凸起表面比画布轻一号,从而形成平滑的分离。 - Obsidian Button
#272735— 额外的按钮填充、嵌入式表单背景、不显眼的交互界面。 - Slate Border
#70707d— 中等厚度的分隔线和内容块之间的结构边界。 - Mist Border
#e2e3ed— 纤细、几乎看不见的边框,几乎看不见的按钮轮廓,输入字段边缘——深色背景上的浅色边框。 - Ash Text
#c3c3cc— 主要文本、辅助文本、附加标签——简化的层级结构,同时保持可读性。
排版
从 12 像素到 65 像素 · 9 步
- arcadia — 替代品: Inter · 轮廓 360, 400, 420, 480 · 主要界面和用户界面 - 此字体适用于导航、正文、按钮、输入框、标签和辅助文本,正文字重为 400,强调部分为 480。Mercury 字体采用中间字重(360、420、480),而非标准字重(300/400/600),使其呈现出独特的平衡感——既不粗也不细,始终保持恰到好处。
- arcadiaDisplay — 替代品: Söhne Breit · 轮廓 360, 480, 530 · 标题和装饰元素的字体使用480字重,适用于28px至65px的所有标题尺寸;而530字重则专用于最大的装饰元素。较低的行高(1.1–1.2)和正的字间距(0.01–0.02em)使装饰性文本呈现出宽阔的建筑感,而非编辑文本中常见的紧凑结构。
音程和形式
| 目的 | 意义 |
|---|---|
| 密度 | 平均的 |
| 基本步骤 | 12px |
| 按钮半径 | 32px |
| 卡片半径 | 12px |
| 阴影 | 无边框,取而代之的是阴影 |
| 各部分之间 | 72px |
| 页面宽度 | 1200px |
AI 将按照Mercury风格构建您的网站并填充内容。
- 通过链接( Instagram 、 TikTok 、 Facebook )发布产品和帖子。
- 从旧网站迁移内容——只需指定地址即可。
- 采用最佳引擎的现代设计: React ( Next.js ),开箱即用服务器端渲染和 SEO 优化。
- 全自动搜索引擎优化,支持搜索结果和神经网络推荐。
相似风格
- Origin Financial — 午夜时分,静谧奢华的画廊。一个安静、近乎昏暗的房间,硕大的衬线字体和几块发光的彩色面板营造出一种感觉:金融是一件精心策划的艺术品。
- Air — 雕塑作品《透过玻璃的午夜天空》
- Slash — 午夜金库,内有镀金账簿
- dope.security — 午夜时分,紫色信标闪耀在航站楼上
- Modal — 昏暗的服务器机房里,一个发光的终端机——唯一的光源是明亮的绿色。
- Giga — 午夜的地平线笼罩着结霜的黑曜石
- Dovetail — 午夜蓝图控制中心
- Dovetail — 黑月下的蓝图——几乎看不见的图表线条,白色的字体,一抹紫色的闪光。
- AgentQL — 夜幕降临,航站楼上空出现北极光
- Supabase — 午夜时分,代码编辑器屏幕上闪烁着一个磷光绿点——如同煤尘海洋中一道独特的色彩脉冲。
- Changelog — 深色玻璃后的天文台控制台
- GitHub — 带有生物发光控制点的太空指挥面板——一个黑暗、充满神秘感的工作空间,一道绿光指引着前进的方向。