큐레이션 · 오픈 · 무료

Oudolf

풍경 건축가 피트 우돌프의 미니멀 포트폴리오 사이트로, 정원 이미지로 채워진 타이포그래피 링크를 특징으로 합니다.

EditorialCleanPhotographicPortfolioRefined

↓ 디자인 시스템 다운로드 (6 MB)OpenDesign 에서 열기

원본 사이트: https://oudolf.com

📦 팩 내용 보기 →

디자인 DNA

풍경정원에디토리얼사진미니멀

풍경 건축 프로젝트로 구성된 큐레이션 포트폴리오.

컬러

#808080Ink

#FFFFFFBG

rgba(128,128,128,0.6)Line

텍스트에 사진 채우기를 적용한 단색 그레이 스케일

타이포그래피

geometric-sans · humanist-sans

display60px · 300
body15px · 400
caption12px · 400

여백

4px

8px

16px

24px

32px

48px

60px

4px 기본 단위, 넉넉한 수직 리듬

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

sm · 0px

md · 0px

lg · 0px

pill · 0px

없음 또는 상호작용 요소에 미묘한 하단 테두리

레이아웃

1280container

12columns

60pxgutter

768 / 1024breakpoints

넉넉한 여백을 가진 넓은 단일 열 레이아웃

모션과 인터랙션

220msmicro

400mssmall

800msmedium

cubic-bezier(0.4, 0, 0.2, 1)easing

scroll 시 페이드인 · 부드러운 opacity 전환

텍스트 내부에 이미지 배경이 표시 · 프로젝트 페이지로 이동

컴포넌트

button 하단 테두리가 있는 미니멀 텍스트 링크
card 배경 이미지가 있는 타이포그래피 목록 항목
input 숨겨진 검색 필드
hero 사진 채우기가 적용된 프로젝트의 타이포그래피 목록

보이스와 금지 목록

톤 고요하고, 세련되고, 전문적인
헤드라인 미니멀리스트, 소문자 네비게이션
CTA 절제된, 텍스트 기반

선명한 강조색을 사용하지 마세요 — 스크린샷은 단색 그레이 팔레트를 보여줍니다.
무거운 테두리나 그림자를 사용하지 마세요 — 스크린샷은 테두리 없는 평면적인 표면을 보여줍니다.
장식적인 아이콘을 사용하지 마세요 — 스크린샷은 단순한 화살표와 검색 아이콘만을 보여줍니다.
복잡한 레이아웃을 사용하지 마세요 — 스크린샷은 넉넉한 단일 열 레이아웃을 보여줍니다.
굵은 타이포그래피를 사용하지 마세요 — 스크린샷은 전체적으로 얇은 웨이트 폰트를 보여줍니다.
그라데이션 배경을 사용하지 마세요 — 스크린샷은 단색 흰색 배경을 보여줍니다.
피하기: 선명한 색상
피하기: 장식적 요소
피하기: 복잡한 애니메이션

팩 안의 실제 스크린샷

Oudolf — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

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

System Prompt

풍경 건축가 피트 우돌프를 위한 미니멀 포트폴리오 사이트입니다. 디자인은 넉넉한 여백과 함께 단색 그레이 팔레트(#808080, #FFFFFF)를 사용합니다. 타이포그래피는 메인 프로젝트 목록에 가벼운 웨이트의 기하학산 세리프를, 본문 텍스트에 휴머니스틱 산세리프를 사용합니다. 레이아웃은 60px 간격의 넉넉한 단일 열 디자인입니다. 주요 주의 사항: 선명한 강조색, 무거운 테두리 또는 그림자, 복잡한 애니메이션을 사용하지 마세요. 이 사이트는 텍스트에 사진 정원 이미지가 채워지는 등, 타이포그래피를 시각적 요소로 탁월하게 활용한 점이 인상적입니다.

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

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

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

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