Lottielab
动画工作室在明亮的纸上
Flatfile
暖羊皮纸上的安静数据期刊。
Flatfile 在暖羊皮纸上呈现安静的编辑设计体系，整个画布带极淡的奶油绿晕染，而非纯白，让数据工具像阅读印刷报告。主要彩色是近黑午夜紫 #090b2b，承载所有标题、品牌标记与强调；交互由唯一近黑胶囊形按钮 #151515 和唯一暖鼠尾草辅助按钮 #e5ebd3 锚定。结构几乎全部由 #e5e7eb 细线组成，体系几乎没有阴影，深度来自 #f8f8f8 卡片层与 #e5ebd3 首屏铺色的表面变化，而非抬升。字体偏编辑风，几何人文无衬线 Flatfile Diatype 承担全部界面职责，Source Serif 4 只用于客户引述，让评价具有印刷出版物感，与数据产品界面对照。
查看原始网站使用规范
建议采用
- 全部主要 CTA 采用 #151515 填充的 99px 圆角胶囊形，不使用矩形按钮。
- 所有展示标题采用 60px Flatfile Diatype 400、-1.92px 字间距，展示语气不重于 500。
- 所有结构分隔与表格线使用 #e5e7eb，它是体系的连接组织。
- Source Serif 4 只用于客户评价卡片内的主视觉引述文字。
- 画布按 Parchment（#e5ebd3）→ Paper（#ffffff）→ Linen（#f8f8f8）叠层建立深度，而非阴影。
- 每个新页面分区上方采用 88px 内边距，维护编辑呼吸空间。
- 页面内容在 max-width 1200px 内居中，内容区内部不从边缘到边缘铺开。
建议避免
- 不引入辅助彩色品牌色，Midnight Ink（#090b2b）是唯一品牌色。
- 卡片不用 box-shadows 分隔，改为将表面颜色变化一级。
- 正文只采用 Graphite（#1b1b1e）或 #090b2b，不使用彩色正文。
- 不使用矩形非胶囊形按钮，99px 圆角是标志性特征。
- 彩色图标不配彩色背景，保持白表面，让图标成为唯一彩色。
- letter-spacing 不宽于 -0.0050em，所有尺寸都采用紧凑字间距。
- Parchment（#e5ebd3）铺色不用于首屏之外，它是首屏氛围，而非通用表面。
