精选 · 开放 · 免费

Stripe Press

一个高端出版品牌,将书籍呈现为精心策划的器物。

EditorialBooksPremiumTypography
Stripe Press 网站截图
↓ 下载设计系统包 (22 MB)在 OpenDesign 中打开

原站: https://press.stripe.com

📦 浏览包内文件 →

01

设计气质 DNA

智识精选出版工艺进步

一个为进步理念打造的现代数字图书馆。

02

色彩

#FFFFFFInk
#D0D1D4Ink soft
#201819BG
#504F4FMuted
rgba(255,255,255,0.1)Line

深邃、温暖的背景营造出高端画廊氛围,使多彩的书籍对象成为视觉焦点。

03

字体

transitional-serif

所有编辑内容均使用 Ivar Headline 和 Ivar Text(过渡衬线体)。 · 所有文本元素保持一致的轻字间距(0.32px)。 · 书脊使用衬线体与等宽字体的混合排版。

04

间距

4px
8px
16px
24px
32px
48px
64px
96px

垂直节奏由内容块和书脊间距驱动。

05

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

sm · 2px
md · 3px
lg · 0px
pill · 999px

极简;主要使用1px实线白色低透明度作为分隔线。

0 4px 24px rgba(0,0,0,0.4) 用于书脊

06

布局

1280container
12columns
24pxgutter
768 / 1024breakpoints

全视口垂直滚动,聚焦于堆叠的3D书籍对象。

07

动效与交互

150msmicro
200mssmall
500msmedium
cubic-bezier(0.25, 0.1, 0.25, 1.0)easing

书脊揭示的平滑滚动联动过渡。 · 页面加载与导航时的透明度与变换动画。

交互元素上的微妙透明度变化或轻微移动。 · 标准指针光标指示可交互性。

08

组件

09

文案语气与禁用清单

10

包内真实截图

抓自真实页面 · 真 computed styles

11

System Prompt

Stripe Press 是一个具有深邃智识美学的高端数字出版品牌。主背景为深暖黑色(#201819),文本为白色(#FFFFFF)和柔和灰色(#D0D1D4)。排版完全采用过渡衬线体,特别是 Ivar 字族,保持正式且具有编辑感的基调。关键交互涉及150ms的平滑过渡和滚动联动动画。关键禁忌:绝不为标题使用无衬线字体,绝不使用明亮霓虹背景,绝不使用复杂网格布局,绝不在容器上使用圆角,绝不使用多种竞争的强调色,绝不使用厚重的投影。布局是一个在全视口容器中垂直堆叠的3D书籍对象。

把这份品味接进你的 Agent

把这套设计的机器可读规格——色彩、字体、动效,整套 DNA——直接交给你的 AI Agent。

OpenDesign 技能 ↗ · 本站 Agent 包 ↗

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