큐레이션 · 오픈 · 무료

Pietrastudio

빠르게 성장하는 브랜드를 위한 비공개 AI 뇌

01

디자인 DNA

현대 전자상거래 브랜드를 위한 세련된 운영 체제

02

컬러

단 하나의 활기찬 강조색으로 구성된 고대비 미니멀리즘

03

타이포그래피

geometric-sans

• display56px · 700
• body16px · 400

모든 텍스트 계층에 기하학적 산세리프 사용 · 큰 디스플레이 타입에는 좁은 트래킹 유지 · 헤드라인과 본문 간 높은 굵기 대비 유지

04

여백

표준 증가 단위를 사용하는 일관된 4px 기반

05

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

거의 검은 rgba 값을 사용한 은은한 1px 테두리

rgba(0, 0, 0, 0.06) 0px 1px 6px 0px · rgba(0, 0, 0, 0.16) 0px 2px 32px 0px

06

레이아웃

여유로운 여백과 명확한 수직 리듬을 가진 중앙 정렬 콘텐츠

07

모션과 인터랙션

hover 시 부드러운 색상 트랜지션 · 인터랙티브 요소의 은은한 배경 변화

버튼과 링크에 은은한 색상 또는 배경 변화 · 색상 변경 또는 스케일을 통한 즉각적인 피드백

08

컴포넌트

• button 흰색 텍스트가 있는 단색 주황색 주요 버튼; 윤곽선 또는 텍스트만 있는 보조 버튼
• card 은은한 그림자와 12px 반경을 가진 깔끔한 카드
• chip 흰색 텍스트가 있는 주황색 알약 모양 태그
• input 은은한 테두리가 있는 깔끔한 미니멀 입력 필드
• hero 핵심 단어에 다색 그라데이션 효과가 적용된 큰 중앙 정렬 타이포그래피

09

보이스와 금지 목록

• 톤 자신감 있고, 전문적이며, 역량을 부여하는
• 헤드라인 핵심 가치 제안을 강조하는 대담하고 간결한 진술
• CTA 행동 지향적이고 혜택 중심적 (예: 무료로 시작하기)

• 복잡한 그라데이션 사용 금지 — 스크린샷에서는 단색 주황색 버튼과 은은한 다색 텍스트 강조만 사용
• 세리프 폰트 사용 금지 — 스크린샷에서는 전체적으로 기하학적 산세리프 사용
• 무거운 드롭 그림자 사용 금지 — 스크린샷에서는 부드럽고 미니멀한 box-shadow 사용
• 복잡한 레이아웃 사용 금지 — 스크린샷에서는 여유로운 여백과 명확한 계층 구조 사용
• 경쟁하는 강조색 다수 사용 금지 — 스크린샷에서는 주요 강조색으로 주황색을 사용하고 다색 그라데이션은 특정 효과로 절제하여 사용
• 어두운 배경을 주요 배경으로 사용 금지 — 스크린샷에서는 거의 흰색 배경에 부드러운 핑크색 섹션이 주를 이룸
• 피하기: 전문 용어가 많거나 지나치게 기술적인 언어
• 피하기: 수동적이거나 주저하는 표현
• 피하기: 복잡하거나 소란스러운 레이아웃

10

팩 안의 실제 스크린샷

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

11

System Prompt

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