큐레이션 · 오픈 · 무료

Periodaisle

따뜻하고 자연스러운 톤과 포용적인 사진을 사용하는 지속가능한 월경 관리 DTC 브랜드입니다.

01

디자인 DNA

친구 같은 느낌을 주는 따뜻하고 자연스러운 웰니스 브랜드입니다.

02

컬러

자연스러운 뉴트럴과 딥 틸이 차분하고 신뢰할 수 있는 기반을 제공합니다.

03

타이포그래피

transitional-serif · humanist-sans

• display72px · 700
• heading24px · 700
• body14px · 400
• caption12px · 400

내비게이션과 레이블에는 대문자를 사용합니다. · 가독성을 위해 본문 텍스트에는 휴머니스트 산세리프를 사용합니다. · 우아함을 더하기 위해 큰 디스플레이 타이포그래피에는 트랜지셔널 세리프를 사용합니다.

04

여백

표준 4px 그리드에 버튼과 입력 필드를 위한 특정 padding 오버라이드를 적용합니다.

05

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

1px solid rgba(41,38,35,1.0)

0px 0px 0px 2px inset rgb(20, 71, 71) · 0px 0px 0px 2px inset rgb(255, 255, 251) · 0px 1px 0px 0px rgb(255, 255, 255)

06

레이아웃

전체 너비 히어로와 스택된 콘텐츠 블록, 그리고 깔끔한 제품 그리드입니다.

07

모션과 인터랙션

hover와 focus 시의 색상 및 box-shadow 전환. · 인터랙티브 요소의 Transform 전환.

색상 변화와 box-shadow 업데이트. · 상태 변화를 통한 시각적 피드백.

08

컴포넌트

• button 촉각적인 느낌을 주는 inset box-shadow을 사용한 알약 모양과 사각형입니다.
• card 미묘한 배경색 변화가 있는 깔끔한 테두리 없는 카드입니다.
• chip 틸 배경 하이라이트가 있는 단순한 텍스트 레이블입니다.
• input 얇은 테두리와 둥근 모서리가 있는 단순한 사각형 입력 필드입니다.
• hero 강렬한 세리프 헤드라인이 있는 크고 몰입적인 사진입니다.

09

보이스와 금지 목록

• 톤 역량을 부여하고, 포용적이며, 솔직합니다.
• 헤드라인 명확한 혜택을 먼저 제시하는 굵은 대문자 또는 큰 세리프 헤드라인.
• CTA '잠금 해제' 또는 '쇼핑하기'와 같은 직접적이고 행동 지향적인 동사.

• 고채도 네온 색상을 사용하지 마세요 — 스크린샷은 #E9EEEA 및 #D3CEC5와 같은 자연스러운 뉴트럴 톤을 보여줍니다.
• 순수 기하학적 산세리프 폰트를 사용하지 마세요 — 스크린샷은 본문 텍스트용으로 휴머니스트 산세리프(Montserrat)를 보여줍니다.
• 여러 레이어로 UI를 지나치게 복잡하게 만들지 마세요 — 스크린샷은 깔끔하고 플랫한 계층 구조를 보여줍니다.
• 주요 요소에 날카롭고 공격적인 모서리를 사용하지 마세요 — 스크린샷은 둥근 사각형과 알약 모양을 보여줍니다.
• 모든 곳에 차갑고 임상적인 흰색 배경을 사용하지 마세요 — 스크린샷은 따뜻한 오프화이트(#FFFFFB)를 보여줍니다.
• 단색 팔레트만 사용하지 마세요 — 스크린샷은 시각적 재미를 위해 딥 틸 악센트(#144747)를 사용합니다.
• 피하기: 의학 용어
• 피하기: 지나치게 임상적인 언어
• 피하기: 공격적인 판매 전술

10

팩 안의 실제 스크린샷

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

11

System Prompt

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