Mapbox

为希望在物理世界上叠加智能的构建者打造的强大工具包。

高对比度深色模式，旨在突出多彩的地图数据和蓝色强调色。

geometric-sans · humanist-sans · monospace

• display64px · 500
• body20px · 400

主标题使用几何无衬线字体。 · 正文依赖于易读的人文主义无衬线字体。 · UI 元素使用标准无衬线字体回退。

标准 4px 网格基础。

使用柔和深灰（#333943）的微妙 1px 边框，定义元素而不显生硬。

0px 0px 100px 50px rgb(14, 16, 18)

居中、内容密集的布局，典型的 SaaS 平台风格。

导航和按钮上平滑的 hover 过渡效果。

微妙的颜色变化和不透明度改变。 · 立即响应，带有轻微 transform。

• button 药丸形（border-radius: 100px），带有纯色强调填充或微妙描边。
• card 深色面板（背景色：#15171B），带有柔和阴影和充足的圆角。
• chip 小型、带描边的文本元素，具有高 border-radius。
• input 微妙的深色输入框，文字对比度清晰。
• hero 居中的巨大排版，搭配双操作按钮。

• 语气 专业、技术性和权威性。
• 标题风格 简洁、以行动为导向且粗体。
• 按钮文案 清晰、以利益为驱动且引人入胜。

• 不要使用浅色背景——截图显示的是深色主题界面。
• 不要使用装饰性衬线字体——截图显示的是简洁的无衬线字体。
• 不要使用尖锐的方形按钮角——截图显示的是药丸形按钮。
• 不要使用霓虹灯色或过于饱和的颜色——截图显示的是聚焦的蓝色强调色。
• 不要使用纤细、精致的线条作为边框——截图显示的是清晰的 1px 边框。
• 不要过度填充主视觉区——截图显示的是充足的留白和大型字体。
• 避免: 缺乏上下文的行话
• 避免: 过于随意的语言
• 避免: 没有实质内容的炒作
• 避免: 主视觉区中密集的大段文本

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