큐레이션 · 오픈 · 무료

Postmark

사람들이 진짜 좋아하는 이메일 배달 서비스입니다.

01

디자인 DNA

중요한 메일을 스팸보다 우선시하는 매우 효율적이고 전담적인 배달 서비스입니다.

02

컬러

가독성을 위해 고대비, 선명한 기본 노란색을 깨끗한 흰색과 깊은 잉크색으로 균형 있게 구성합니다.

03

타이포그래피

slab-serif · humanist-sans · monospace

• display56px · 900
• heading40px · 700
• subhead20px · 400
• body16px · 400
• caption14px · 400

메인 강조 제목에는 친근함과 강점을 전달하기 위해 slab-serif를 사용합니다. · 본문 텍스트에는 우수한 가독성과 현대적인 느낌을 유지하기 위해 humanist-sans를 사용합니다. · 대형 디스플레이 텍스트에는 좁은 자간을 유지합니다.

04

여백

8px 그리드

05

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

1px solid rgba(36,39,45,1)

0px 2px 3px 0px rgba(0,0,0,0.07) · 0px 4px 15px 0px rgba(0,0,0,0.07) · 0px 9px 25px 0px rgba(0,0,0,0.2)

06

레이아웃

콘텐츠는 왼쪽, 비주얼/추천 카드는 오른쪽에 배치하는 분할 열을 가진 표준 히어로 레이아웃입니다.

07

모션과 인터랙션

뷰포트에 진입하는 요소를 위한 페이드 인 및 슬라이드 업 효과. · hover 상태를 위한 부드러운 색상 전환.

배경색 또는 텍스트색의 섬세한 변화와 부드러운 전환 효과. · 표준 버튼 상태를 통한 즉각적인 피드백.

08

컴포넌트

• button 주요 행동 유도를 위해 사용되는 둥근 모서리의 단색 기본 색상 버튼입니다.
• card 추천사를 위해 사용되는 섬세한 그림자와 둥근 모서리가 있는 흰색 배경 카드입니다.
• chip 화살표 표시기가 있는 간단한 텍스트 링크입니다.
• input 명확한 테두리와 패딩이 있는 표준 텍스트 입력 필드입니다.
• hero 선명한 배경색 위의 크고 대담한 타이포그래피로, 지원 비주얼이나 행동 유도 요소가 함께 제공됩니다.

09

보이스와 금지 목록

• 톤 자신감 있고直接적이며, 친근합니다.
• 헤드라인 가치 제안에 대한 굵고 명확한 진술.
• CTA 시험 시작이나 자세한 알아보기에 초점을 맞춘 행동 지향적.

• 다크 모드 테마를 사용하지 않습니다 — 스크린샷은 기본 배경으로 밝고 활기찬 노란색을 보여줍니다.
• 지나치게 복잡한 그라데이션을 사용하지 않습니다 — 스크린샷은 주로 단색 배경에 그림자를 통한 섬세한 깊이감을 보여줍니다.
• 얇고 장식적인 세리프 서체를 사용하지 않습니다 — 스크린샷은 견고한 slab-serif 디스플레이 폰트를 보여줍니다.
• 채도가 낮고 대비가 약한 팔레트를 사용하지 않습니다 — 스크린샷은 선명하고 고대비의 배합을 보여줍니다.
• 고밀도의 다열 레이아웃을 사용하지 않습니다 — 스크린샷은 넉넉한 여백과 섹션 간 명확한 구분을 보여줍니다.
• 일반적이고 추상적인 아이콘을 사용하지 않습니다 — 스크린샷은 개성을 더해주는 맞춤 라인 아트 일러스트레이션을 보여줍니다.
• 피하기: 비개발자를 소외시킬 수 있는 지나치게 기술적인 전문 용어를 피합니다.
• 피하기: 차갑거나 순수하게 기업적인 어조를 피합니다.

10

팩 안의 실제 스크린샷

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

11

System Prompt

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