큐레이션 · 오픈 · 무료

Drepute

강렬한 사진 히어로와 명확한 행동 유도가 있는 깔끔하고 분위기 있는 프리런치 페이지입니다.

01

디자인 DNA

제품이 스스로 말하게 하는 프리미엄 프리런치 대기실입니다.

02

컬러

사진 배경이 주도하는 고대비 단색 팔레트입니다.

03

타이포그래피

transitional-serif · humanist-sans

• display62px · 400
• h244px · 400
• body16px · 400

04

여백

8px 기반 그리드와 넉넉한 섹션 패딩(수직 56px)을 사용합니다.

05

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

1px solid #000000

rgba(0, 0, 0, 0.3) 0px 2px 6px 0px · rgba(0, 0, 0, 0.25) 0px 3px 18px 0px

06

레이아웃

전체 너비의 사진 히어로 뒤에 중앙 정렬된 콘텐츠 섹션이 이어집니다.

07

모션과 인터랙션

페이지 로드 요소용 1초 ease-in 트랜지션

버튼용 배경 트랜지션입니다. · 인터랙티브 요소용 기본 포인터 커서입니다.

08

컴포넌트

• button 검은색 대문자 텍스트와 작은 border-radius가 있는 흰색 배경입니다.
• input 얇은 흰색 테두리가 있는 다크 배경입니다.
• hero 중앙 정렬된 텍스트와 큰 배경 이미지가 있는 전체 뷰포트 높이입니다.

09

보이스와 금지 목록

• 톤 미니멀하고 기대감을 줍니다.
• 헤드라인 페이지 중앙에 배치된 짧고 큰 세리프 단어입니다.
• CTA 직접적이고 기능적인 문구(예: '자세히 보기', '수락').

• 밝거나 네온색 팔레트를 사용하지 마세요 — 스크린샷은 어두운 분위기의 사진 테마를 보여줍니다
• 작고 비좁은 텍스트를 사용하지 마세요 — 스크린샷은 넉넉한 간격과 큰 헤드라인을 보여줍니다
• 복잡한 그리드 레이아웃을 사용하지 마세요 — 스크린샷은 단순한 단일 열 중앙 정렬 레이아웃을 보여줍니다
• 둥글고 둥근 버튼을 사용하지 마세요 — 스크린샷은 최소한의 radius를 가진 날카롭고 직사각형 버튼을 보여줍니다
• 장식용 또는 필기체 글꼴을 사용하지 마세요 — 스크린샷은 명확한 세리프 및 sans-serif 조합을 보여줍니다
• 복잡한 내비게이션을 사용하지 마세요 — 스크린샷은 단일 버튼만 있는 깔끔한 헤더를 보여줍니다
• 피하기: 가벼운 말
• 피하기: 긴 문장
• 피하기: 복잡한 UI 패턴

10

팩 안의 실제 스크린샷

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

11

System Prompt

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