큐레이션 · 오픈 · 무료

Isla Beauty

미니멀하고 현대적인 미적 감각으로 집중적이고 효과적인 뷰티 제품을 제공하는 프리미엄 스킨케어 브랜드.

01

디자인 DNA

클린한 미적 요소와 과학적 효능을 결합한 럭셔리 스킨케어 브랜드.

02

컬러

크리미 오프화이트와 차콜이 주도하는 따뜻하고 세련된 팔레트에, 시선을 사로잡는 생생하고 활기찬 레드 악센트가 포인트로 사용되었습니다.

03

타이포그래피

transitional-serif · humanist-sans

• display64px · 400

대담하고 표현력 있는 디스플레이 헤드라인에는 transitional-serif를 사용합니다. · 가독성 높은 본문과 내비게이션에는 humanist-sans를 사용합니다. · 정교한 느낌을 주기 위해 디스플레이 텍스트에는 타이트한 letter-spacing을 유지합니다.

04

여백

일관된 4px 그리드가 구조를 제공하며, 프리미엄이고 깔끔한 느낌을 유지하기 위해 프로모션 영역에는 넉넉한 간격을 둡니다.

05

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

검정 또는 다크 그레이를 사용한 얇고 절제된 테두리는 인터랙티브 요소와 섹션을 명확히 정의하되 무겁지 않게 합니다.

rgba(0, 0, 0, 0.06) 0px 2px 8px 0px · rgba(0, 0, 0, 0.1) 0px 5px 10px 0px

06

레이아웃

지속적인 상단 내비게이션 바와 크고 몰입감 있는 사진 섹션을 갖춘, 깔끔하고 중앙 정렬된 레이아웃입니다.

07

모션과 인터랙션

모달 오버레이의 부드러운 fade-in 전환. · 인터랙티브 요소의 절제된 hover 전환. · 프로모션 배너 이동을 위한 변환 효과.

인터랙티브 요소에 명확한 피드백을 제공하는 절제된 색상 또는 불투명도 변화. · 즉각적인 시각적 반응, 주로 새로운 상태나 모달로의 전환이 동반됨.

08

컴포넌트

• button 절제된 테두리나 솔리드 채우기를 사용하는 미니멀한 버튼으로, 주로 대문자 텍스트와 필 모양 또는 약간 둥근 모서리를 사용합니다.
• card 고품질 사진과 넉넉한 여백에 의존하는 깔끔한 제품 프레젠테이션입니다.
• chip 필터링이나 설문 옵션을 위한 간단한 텍스트 기반 선택 칩입니다.
• input 최소한의 테두리를 사용하는 깔끔하고 눈에 띄지 않는 입력 필드입니다.
• hero 전체 너비의 몰입감 있는 사진 히어로 섹션으로, 크고 표현력 있는 타이포그래피가 겹쳐져 있습니다.

09

보이스와 금지 목록

• 톤 자신감 있고 미니멀하며, 효능에 초점을 맞춥니다.
• 헤드라인 강조를 위해 세리프와 산세리프 타이포그래피를 혼합하여 사용하는, 표현력 있고 때로는 대화체인 스타일.
• CTA 직접적이고 행동을 유도하는 스타일로, 버튼에 주로 대문자 텍스트를 사용합니다.

• 복잡한 그라디언트를 사용하지 마세요 — 스크린샷에는 대신 솔리드하고 깔끔한 배경색이 사용되어 있습니다.
• 다크 모드를 사용하지 마세요 — 사이트는 전체적으로 밝고 크리미한 색상 체계를 사용합니다.
• 표현력 있는 헤드라인에 장난스럽거나 둥근 산세리프 폰트를 사용하지 마세요 — 스크린샷에는 transitional-serif가 사용되어 있습니다.
• 컴포넌트에 무거운 드롭 섀도우를 사용하지 마세요 — 스크린샷에는 높이감을 주기 위해 매우 절제되고 부드러운 섀도우가 사용되어 있습니다.
• 밝은 네온이나 기본 색상을 사용하지 마세요 — 스크린샷에서는 차분하고 따뜻한 팔레트 위에 특정하고 생생한 레드 악센트가 사용되어 있습니다.
• 멀티컬럼 텍스트 블록을 사용하지 마세요 — 스크린샷에서는 가독성을 위해 넉넉한 여백과 중앙 정렬된 단일 컬럼 레이아웃이 사용되어 있습니다.
• 피하기: 지저분하거나 혼란스러운 레이아웃
• 피하기: 화려하거나 네온 색상
• 피하기: 지나치게 복잡한 타이포그래피

10

팩 안의 실제 스크린샷

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

11

System Prompt

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