큐레이션 · 오픈 · 무료

Poppi

대담한 색상과 장난스러운 기하학을 사용하는, 에너제틱하고 팝아트에서 영감을 받은 DTC 음료 브랜드.

01

디자인 DNA

활기찬 레트로 감성 주스바와 현대 웰니스 브랜드의 만남.

02

컬러

강렬한 옐로우 베이스와 강렬한 핫 핑크 악센트를 기반으로 한 고대비, 고채도 팔레트.

03

타이포그래피

grotesque-sans

• display60px · 700
• h128px · 700
• body16px · 400

캐주얼하고 친근한 분위기를 위해 소문자 textTransform을 사용합니다. · 강한 임팩트를 위해 디스플레이 사이즈에 타이트한 음수 letter-spacing을 적용합니다. · 텍스트와 선명한 배경색 사이에 높은 대비를 유지합니다.

04

여백

유연한 padding(주로 16px 또는 32px)을 사용하며, 주요 섹션 사이에는 더 큰 수직 간격을 둡니다.

05

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

입력 필드와 카드에 자주 사용되는 2px solid rgb(229, 231, 235).

None: None · None: None · None: None

06

레이아웃

이 모달 뷰를 위한 표준 중앙 정렬 단일 열 레이아웃.

07

모션과 인터랙션

background-color, color, box-shadow에 대한 부드러운 전환. · 요소 가시성을 위한 opacity 페이드.

배경색이나 box-shadow의 미묘한 변화, 주로 전환과 함께. · 색상 변화나 transform을 통해 즉각적인 시각적 피드백.

08

컴포넌트

• button 단색 배경(예: 핑크)과 흰색 텍스트가 적용된 넓고 둥근(필) 형태의 버튼.
• card components는 종종 단색의 밝은 배경색과 둥근 모서리를 특징으로 합니다.
• chip 분석된 스크린샷에서 두드러지게 나타나지 않습니다.
• input 단색 배경과 미묘한 테두리가 적용된 표준 둥근 입력 필드.
• hero 큰 타이포그래피와 돋보이는 제품 이미지가 있는 풀幅의 선명한 그라데이션 배경.

09

보이스와 금지 목록

• 톤 장난스럽고, 열정적이며, 대화체입니다.
• 헤드라인 대담하고, 소문자이며, 강렬하며, 주로 브랜드 특유의 렌트로 폰트를 사용합니다.
• CTA 직접적이고, 친근하며, 행동 지향적입니다(예: 'stay in touch').

• 채도가 낮고 무딘 색상을 사용하지 마세요 — 스크린샷은 활기차고 고채도의 옐로우와 핑크를 보여줍니다.
• 헤드라인에 대문자 텍스트를 사용하지 마세요 — 스크린샷은 모두 소문자의 타이포그래피를 보여줍니다.
• 주요 컴포넌트에 날카롭고 직사각형 모서리를 사용하지 마세요 — 스크린샷은 큰 border-radius(10px에서 9999px)를 보여줍니다.
• 미묘하고 확산된 그림자를 사용하지 마세요 — 스크린샷은 단단하고 고정된 오프셋 그림자(5px 5px 0px)를 보여줍니다.
• 다크 모드를 사용하지 마세요 — 스크린샷은 밝고 라이트 모드 위주의 팔레트를 보여줍니다.
• 이런 종류의 집중된 모달에 복잡한 그리드 레이아웃을 사용하지 마세요 — 스크린샷은 중앙 정렬된 단일 열 레이아웃을 보여줍니다.
• 피하기: 공식적인 언어
• 피하기: 복잡한 전문 용어
• 피하기: 지나치게 진지한 어조

10

팩 안의 실제 스크린샷

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

11

System Prompt

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