큐레이션 · 오픈 · 무료

Limonoslo No

굵은 타이포그래피, 따뜻한 색상, 몰입감 있는 푸드 사진을 결합한 모던 레스토랑 웹사이트.

01

디자인 DNA

신선한 재료와 굵고 깔끔한 타이포그래피를 결합한 생동감 넘치는 모던 레스토랑.

02

컬러

크리미 배경, 다크 자연 잉크, 그리고 단 하나의 생동감 있는 옐로우 악센트를 결합한 따뜻하고 매력적인 팔레트.

03

타이포그래피

sans-serif

• display56px · 700
• heading36px · 700
• body16px · 400
• caption15px · 400

04

여백

4의 배수를 통해 일관된 수직 리듬을 확립하여 균형 잡힌 여백을 보장합니다.

05

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

강조를 위한 다크 그린(#103B15)의 단색 테두리와 구분을 위한 은은한 라이트 그레이(#D6D6D6).

rgba(0,0,0,0.3) 0px 32px 68px 0px

06

레이아웃

명확한 구조적 구분과 풍부한 간격을 갖춘 표준 그리드 레이아웃.

07

모션과 인터랙션

배경색과 불투명도에 대한 미묘한 전환. · 동적 레이아웃 조정을 위한 너비 및 높이 애니메이션.

인터랙티브 요소에서의 색상 변화와 미묘한 전환. · 액티브 상태의 전환과 즉각적인 시각적 피드백.

08

컴포넌트

• button 다크 대문자 텍스트가 적용된 단색 옐로우(#F7EA48) 버튼, 또는 화이트 대문자 텍스트가 적용된 다크 단색 버튼.
• card 텍스트가 겹치고 미묘한 드롭 섀도우가 적용된 사진형 레이아웃.
• chip 최소한으로 사용되며, 주로 구조적 내비게이션 요소.
• input 명확한 시각적 피드백과 다크 테두리가 적용된 표준 폼 필드.
• hero 고품질 푸드 사진이 특징인 풀폭 몰입형 히어로 섹션.

09

보이스와 금지 목록

• 톤 매력적이고 모던하며 열정적인.
• 헤드라인 배경과 대비가 높은 굵은 대문자 타이포그래피.
• CTA 강한 색상 악센트가 적용된 직접적인 대문자 명령.

• 쿨하고 모노크롬 팔레트를 사용하지 마세요 — 스크린샷은 따뜻하고 매력적인 톤을 보여줍니다.
• 모든 UI 요소에 무거운 드롭 섀도우를 적용하지 마세요 — 스크린샷은 선택적 사용을 보여줍니다.
• 미묘하고 저대비 타이포그래피를 사용하지 마세요 — 스크린샷은 굵고 읽기 쉬운 타입을 특징으로 합니다.
• 명확한 전달보다 복잡한 애니메이션을 우선시하지 마세요 — 스크린샷은 최소한의 모션을 보여줍니다.
• 명확한 레이블 없이 추상적인 아이콘을 사용하지 마세요 — 스크린샷은 텍스트 기반 내비게이션에 의존합니다.
• 풀블리드 사진을 피하지 마세요 — 스크린샷은 몰입감 있는 푸드 이미지를 두드러지게 사용합니다.
• 피하기: 지나치게 공식적인 언어
• 피하기: 미묘한 텍스트 두께
• 피하기: 묵직한 컬러 팔레트

10

팩 안의 실제 스크린샷

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

11

System Prompt

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