精选 · 开放 · 免费

Fathom

一款简约、隐私优先的 Google Analytics 替代品。

01

设计气质 DNA

一个冷静、极简的网络数据分析仪表盘，优先考虑隐私而非复杂性。

02

色彩

中性、高对比度的配色方案，仅使用一种鲜明的紫色作为主要操作的强调色。

03

字体

humanist-sans · monospace

• display56px · 500
• heading40px · 500
• body18px · 400
• caption14px · 400

使用 -webkit-font-smoothing: antialiased 实现清晰的文本渲染。 · 将行宽限制在约 680px 以获得最佳可读性。 · 对代码片段或数据表格使用等宽字体。

04

间距

基于 4px 的网格，搭配充足的留白以强调简约。

05

表面 (圆角 / 阴影 / 边线)

1px solid rgba(24, 27, 25, 0.1)

None: None

06

布局

单栏居中布局，主视觉下方是双栏功能网格。

07

动效与交互

内容进入视口时微妙的淡入效果。 · 交互元素的色彩和背景平滑过渡。

按钮和链接上的颜色变化或微妙背景移动。 · 轻微的缩放或颜色变化以指示激活状态。

08

组件

• button 高对比度的实心圆角按钮，主按钮使用强调色，次按钮使用深中性色。
• card 简洁的卡片，边框极简或带微弱阴影，用于功能亮点和数据表格。
• chip 浅背景、深色文字的小型圆角标签，用于如“新功能”等标签。
• input 简洁的文本输入框，边框干净，聚焦状态微妙。
• hero 左侧为大号、粗体的排版文字，右侧为数据可视化或模型图。

09

文案语气与禁用清单

• 语气 清晰、直接、令人安心。
• 标题风格 强调简约和隐私的粗体、利益驱动型陈述。
• 按钮文案 以行动为导向的短语，如“开始免费试用”，并搭配闪电图标。

• 不要使用复杂的渐变或厚重的纹理——截图显示的是干净、纯色的背景。
• 不要使用明亮、多彩的配色方案——截图仅使用了一种紫色强调色。
• 不要使用装饰性、手写体或过度风格化的字体——截图使用的是简洁的无衬线字体。
• 不要在用户界面上堆砌过多元素——截图优先考虑留白和清晰度。
• 不要默认使用深色模式——截图显示的是浅色主题界面。
• 不要对所有元素使用圆角——截图显示部分用户界面元素使用的是直角。
• 避免: 技术术语或复杂的营销话术。
• 避免: 具有侵略性或高压的销售语言。
• 避免: 模糊或过于抽象的利益点。

10

包内真实截图

抓自真实页面 · 真 computed styles

11

System Prompt

en · zh-CN · zh-TW · ja · ko