큐레이션 · 오픈 · 무료

Graza

장난기 있는 패키징과 뚜렷한 흙내음 시각 정체성을 통해 재해석된 프리미엄 올리브 오일.

brandfood
Graza 스크린샷
↓ 디자인 시스템 다운로드 (45 MB)OpenDesign 에서 열기

원본 사이트: https://www.graza.co

📦 팩 내용 보기 →

01

디자인 DNA

올리브 오일짜 쓸 수 있는주방프리미엄장난기 있는

장난기 있고 촉각적인 감각이 있는 하이엔드 수제 식품 브랜드.

02

컬러

#D1E030Accent
#3C422EInk
#F6E6D9BG
#4E5340Muted
rgba(60, 66, 46, 1)Line

다크 올리브 그린과 부드러운 피치색이 주도하는 흙내음 나고 따뜻한 기본 팔레트에, 생동감 있는 차트루즈 강조색으로 포인트를 줍니다.

03

타이포그래피

transitional-serif · typewriter

04

여백

4px
8px
16px
24px
32px
48px
64px
96px

수직 간격은 넉넉한 간격을 사용하며, 보통 35px 또는 68px로 설정하여 큰 이미지와 굵은 타이포그래피가 숨쉴 수 있게 합니다.

05

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

sm · 10px
md · 20px
lg · 20px
pill · 9999px

테두리는 주로 윤곽과 분리를 위해 사용되며, 보통 1px solid 다크 그린으로 설정합니다.

06

레이아웃

1280container
12columns
24pxgutter
768 / 1024breakpoints

풀폭 포토그래픽 히어로 섹션 후, 제품 카드를 위한 넉넉한 그리드 레이아웃이 이어집니다.

07

모션과 인터랙션

250msmicro
250mssmall
400msmedium
cubic-bezier(0.25, 0.1, 0.25, 1)easing

인터랙티브 요소를 위한 부드러운 배경색과 불투명도 트랜지션. · hover 상태를 위한 transform 트랜지션.

버튼이나 링크 같은 요소들이 배경색, 테두리색, 또는 transform이 미세하게 변경됩니다. · 배경색이나 transform 변화를 통해 즉각적인 피드백을 제공합니다.

08

컴포넌트

09

보이스와 금지 목록

10

팩 안의 실제 스크린샷

Graza — 桌面首屏（hero）
桌面首屏（hero）
Graza — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Graza — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Graza — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Graza — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Graza — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Graza — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Graza — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Graza — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Graza — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Graza — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Graza — 桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
Graza — 移动首屏
移动首屏

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

11

System Prompt

Graza는 품질과 디자인을 중시하는 소비자를 대상으로 하는 프리미엄이고 장난기 있는 올리브 오일 브랜드입니다. 이 사이트는 부드러운 피치색(#F6E6D9)과 다크 올리브 그린(#3C422E)을 중심으로 한 따뜻하고 흙내음이 나는 팔레트를 사용하며, 호출 행동을 위해 생동감 있는 차트루즈 강조색(#D1E030)을 적용합니다. 타이포그래피는 우아한 트지지션 세리프 전시용 폰트와 타자기 스타일 본문 텍스트를 혼합합니다. 핵심 금지 사항: 다�크 모드 사용 금지, 헤드라인에 산세리프 사용 금지, 희미한 강조색 사용 금지, 날카로운 모서리 사용 금지, 빽빽한 텍스트 사용 금지, 차가운 중립색 사용 금지. 레이아웃은 편집적이고 프리미엄 느낌을 만들기 위해 큰 풀블리드 사진과 넉넉한 여백에 의존합니다.

이 감각을 당신의 에이전트에

이 디자인의 기계 판독 가능한 사양——색상·타이포·모션까지——을 그대로 AI 에이전트에 전달하세요.

OpenDesign 스킬 ↗ · 이 팩 (에이전트용) ↗

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