MetaMask

一个大胆、几何化的去中心化金融门户，将技术精确性与平易近人的俏皮美学相结合。

一个大胆的高对比度调色板，使用富有表现力、饱和的颜色与柔和的淡彩色形成对比，创造视觉趣味。

geometric-sans · monospace

• display120px · 700
• h148px · 600
• body16px · 400
• caption12px · 400

标题使用极紧的行高和字间距以增强冲击力。 · 正文使用标准字重，保持高可读性。 · UI 标签和导航使用中等字重。

一个一致的 4px 基础网格，采用线性比例，实现可预测、和谐的间距。

极简风格，依靠背景颜色对比和强烈的排版来进行区域分隔。

rgb(204, 204, 204) 0px 0px 2px 2px · rgb(128, 128, 128) 0px 0px 5px 0px

一个居中的、以列为主导的布局，包含大型、富有表现力的主视觉区域和基于网格的功能展示区。

变换上使用有弹性的、弹跳感的缓动，营造俏皮感。 · 元素过渡时使用平滑的透明度渐隐。 · 交错入场动画使用缓动延迟。

交互元素上微妙的变换和颜色变化。 · 除了标准聚焦状态外，视觉反馈极小。

• button 胶囊形、高对比度（黑色或深紫色配白色文字）按钮，带有充足的内边距。
• card 色彩丰富、圆角的卡片，采用纯色背景填充且无可见边框，用于功能亮点展示。
• chip 在此视图中不是显著元素。
• input 简洁的胶囊形输入框，带有清晰的边框。
• hero 巨大、紧密堆叠的标题文字主导视口，配有抽象的几何插图。

• 语气 自信、直接且赋予力量，将产品定位为必备工具。
• 标题风格 简短、有力且以行动为导向的短语，以巨大、粗体的排版呈现。
• 按钮文案 简单、直接的行动号召（如“获取 META MASK”），置于高对比度的胶囊按钮中。

• 不要使用纤细、轻盈的字体作为标题——截图显示的是极重、粗体的展示排版。
• 不要将深色模式设为默认——主要背景是桃色和青柠色等柔和的淡彩色。
• 不要给卡片添加厚重的盒子阴影——截图显示的是平坦、彩色的表面，没有投影。
• 不要使用尖锐的矩形按钮——截图显示的是一致的胶囊形（高圆角）按钮。
• 不要创建密集、文字繁多的布局——截图显示的是充足的空白和巨大、有冲击力的文字。
• 不要使用柔和的单色调色板——截图显示的是充满活力的、多色的区域。
• 避免: 缺乏上下文的技术术语
• 避免: 被动或犹豫的语言
• 避免: 微妙或低调的声明

历史提取与模型分析 · 尚未逐项校验