큐레이션 · 오픈 · 무료

Rijksmuseum

강렬한 사진과 대담한 타이포그래피 브랜딩을 통해 고전 예술을 선보이는 프리미엄 문화유산 사이트.

01

디자인 DNA

권위 있는 국가 갤러리 입구.

02

컬러

단일 따뜻한 강조색을 사용한 고대비 단색으로, 사진 오버레이를 통해 시각적 풍요로움을 얻습니다.

03

타이포그래피

humanist-sans

• display120px · 700
• headline24px · 700
• body17px · 400

네비게이션 및 섹션 라벨에는 대문자 사용 · 헤드라인 및 주요 작업에는 볼드 웨이트 사용

04

여백

사진이 숨쉴 수 있도록 컨테이너 내부에 풍부한 padding을 둡니다.

05

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

최소화, 주로 폼 요소에 1px solid border 또는 미묘한 구분선 사용.

06

레이아웃

오버레이된 타이포그래피가 있는 풀블리드 히어로 섹션에서 구조화된 콘텐츠 그리드로 전환.

07

모션과 인터랙션

hover 시 미묘한 background-size 전환 · 콘텐츠 로딩을 위한 fade-in/out · 인터랙티브 상태를 위한 매끄러운 색상 전환

background-color 전환 및 약간의 background-size 스케일링. · 즉각적인 시각적 피드백.

08

컴포넌트

• button 대문자 텍스트가 있는 솔리드 블록 색상, 날카롭거나 약간 둥근 모서리.
• card 텍스트가 사진 위에 직접 오버레이된 이미지 중심.
• chip 솔리드 배경이 있는 소형 대문자 태그.
• input 최소화된 밑줄 또는 가벼운 테두리가 있는 필드.
• hero 오버레이된 대규모 타이포그래피 브랜딩이 있는 거대한 풀폭 사진.

09

보이스와 금지 목록

• 톤 권위 있고, 우아하며, 매력적인 어조.
• 헤드라인 직접적이고 임팩트 있는, 주로 대문자 사용.
• CTA 행동 지향적, 대문자, 높은 가시성.

• 장난스럽거나 둥근 글꼴을 사용하지 마세요 — 스크린샷은 구조화된 휴머니스트 산세리프를 보여줍니다.
• 다색 팔레트를 사용하지 마세요 — 스크린샷은 백, 검정, 단일 오렌지 강조색으로 구성된 절제된 팔레트를 보여줍니다.
• 장식적인 테두리나 복잡한 그림자를 사용하지 마세요 — 스크린샷은 플랫하고 깔끔한 표면 스타일을 보여줍니다.
• 작고 비좁은 타이포그래피를 사용하지 마세요 — 스크린샷은 넉넉한 간격의 크고 가독성 높은 타입을 보여줍니다.
• 추상적인 패턴을 사용하지 마세요 — 스크린샷은 고품질 사진 이미지를 주요 시각 요소로 사용합니다.
• 네비게이션에 소문자를 사용하지 마세요 — 스크린샷은 대문자 네비게이션 링크를 보여줍니다.
• 피하기: 비속어
• 피하기: 지나치게 캐주얼한 표현
• 피하기: 복잡한 학술 용어

10

팩 안의 실제 스크린샷

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

11

System Prompt

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