큐레이션 · 오픈 · 무료

Stripe Press

도서를 큐레이션된 아티팩트로 선보이는 프리미엄 출판 인임프린트.

01

디자인 DNA

진보의 아이디어를 위한 현대적 디지털 도서관.

02

컬러

다크하고 따뜻한 배경으로 프리미엄 갤러리 분위기를 조성하며, 컬러풀한 도서 오브젝트가 시선을 집중시킵니다.

03

타이포그래피

transitional-serif

• display56px · 600
• heading25px · 600
• body16px · 400

모든 편집 콘텐츠에 Ivar Headline 및 Ivar Text (트랜지셔널 세리프)를 사용합니다. · 모든 텍스트 요소에서 일관된 가벼운 자간(0.32px)을 유지합니다. · 도서 표지에는 세리프와 모노스페이스 타이포그래피를 혼합하여 사용합니다.

04

여백

콘텐츠 블록과 도서 표지 간격에 의해 구동되는 수직 리듬.

05

표면 (라운드 / 그림자 / 경계선)

최소화; 주로 불투명도가 낮은 1px solid white를 구분선으로 사용.

도서 표지용 0 4px 24px rgba(0,0,0,0.4)

06

레이아웃

스택형 3D 도서 오브젝트에 집중된 풀 뷰포트 수직 스크롤.

07

모션과 인터랙션

도서 표지 드러냄을 위한 부드러운 스크롤 연동 전환. · 페이지 로드 및 내비게이션을 위한 불투명도 및 변환 애니메이션.

인터랙티브 요소에 대한 미묘한 불투명도 변화 또는 약간의 움직임. · 인터랙티브함을 나타내는 표준 포인터 커서.

08

컴포넌트

• button 미니멀한 텍스트 기반 또는 간단한 알약 형태 버튼.
• card 인터랙티브 카드 역할을 하는 3D 렌더링 도서 오브젝트.
• chip 보이지 않음.
• input 보이지 않음.
• hero 다크 배경 위에 쌓인 3D 도서 표지.

09

보이스와 금지 목록

• 톤 지적이고, 세련되며, 진지함.
• 헤드라인 격식 있는, 대문자 또는 타이틀 케이스 세리프 텍스트.
• CTA 절제되고 미니멀함.

• 제목에 세리프 외 글꼴을 사용하지 마세요 — 스크린샷에서 세리프 글꼴을 보여줍니다.
• 밝고 네온빛 배경을 사용하지 마세요 — 스크린샷에서 다크하고 은은한 배경을 보여줍니다.
• 복잡한 격자 레이아웃을 사용하지 마세요 — 스크린샷에서 스택형 수직 레이아웃을 보여줍니다.
• 주요 컨테이너에 둥근 모서리를 사용하지 마세요 — 스크린샷에서 날카로운 모서리를 보여줍니다.
• 경쟁하는 여러 악센트 색상을 사용하지 마세요 — 스크린샷에서 색상이 도서 오브젝트로 제한되는 것을 보여줍니다.
• 무거운 드롭 그림자를 사용하지 마세요 — 스크린샷에서 3D 오브젝트에 대한 미묘하고 사실적인 조명을 보여줍니다.
• 피하기: 장난스러운 언어
• 피하기: 화려한 색상
• 피하기: 무거운 장식 요소

10

팩 안의 실제 스크린샷

실제 페이지에서 캡처 · 실 computed styles

11

System Prompt

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