← OpenDesign 큐레이션 · 오픈 · 무료
Droga5
거대하고 대담한 타이포그래피와 시네마틱한 사진을 활용하여 권위를 전달하는 프리미엄 크리에이티브 에이전시 사이트입니다.
agency advertising
01
디자인 DNA
창의적 대담한 권위 있는 모던한 글로벌한
깔끔하고 대담한 정밀함으로 랜드마크 포트폴리오를 선보이는 마스터 건축가.
02
컬러
#0000D5Accent
#000000Ink
#FFFFFFBG
#F4F4F4BG quiet
#949799Muted
rgba(0,0,0,0.1)Line
에디토리얼적 구두점을 위한 날카로운 블루 악센트 하나를 더한, 엄격한 고대비 흑백 기반입니다.
03
타이포그래피
grotesque-sans · humanist-sans · monospace
display 100px · 700heading 35px · 400body 16px · 400caption 10px · 400표시용 타이포그래피는 최대의 임팩트를 위해 중앙 정렬됩니다. · 작은 메타데이터 라벨에는 대문자 변환을 사용합니다.
04
여백
4px
8px
16px
24px
32px
48px
64px
96px
가독성과 시각적 무게감을 유지하기 위해 거대한 타이포그래피 주변에 넉넉한 여백을 둡니다.
05
표면 (라운드 / 그림자 / 경계선)
sm · 0px
md · 0px
lg · 0px
pill · 0px
최소화; 주로 보더 없이, 순수한 대비와 간격에 의존합니다.
06
레이아웃
1280 container
12 columns
24px gutter
768 / 1024 breakpoints
넉넉한 여백의 텍스트 블록과 교차하는 풀블레이드 히어로 섹션입니다.
07
모션과 인터랙션
200ms micro
300ms small
500ms medium
cubic-bezier(0.19, 1, 0.22, 1) easing
인터랙티브 요소의 부드럽고 빠른 색상 및 배경 전환입니다.
미묘한 색상 변화 또는 드러남. · 부드러운 전환과 즉각적인 시각적 피드백.
08
컴포넌트
button 흰색 텍스트가 있는 검은색 단색 사각형으로, 모서리가 둥글지 않습니다. card 텍스트 오버레이가 있는 전폭 사진 패널입니다. hero 중앙 정렬된 거대한 헤드라인 뒤에 전폭 비디오 또는 이미지가 옵니다. 09
보이스와 금지 목록
톤 자신감 있고 권위적이며 전문적입니다. 헤드라인 거대하고 촘촘한 자간의 대담한 타이프로 제시된 선언적 문장. CTA 간단명료하며 직접적입니다. 예: '더 읽기' 또는 '우리의 작업 보기'. 모서리를 둥글게 하지 마세요 — 스크린샷에 모든 버튼과 컨테이너의 날카롭고 사각형 모서리가 보입니다 화려한 팔레트를 사용하지 마세요 — 스크린샷에 엄격한 검정, 흰색, 단일 블루 악센트 체계가 보입니다 중앙 정렬된 가벼운 타이포그래피를 사용하지 마세요 — 스크린샷에 거대하고 대담하며 검은색 헤드라인이 촘촘한 자간으로 표시됩니다 복잡한 그리드나 카드 레이아웃을 사용하지 마세요 — 스크린샷에 크고 풀블레이드 사진 섹션이 보입니다 작고 비좁은 간격을 사용하지 마세요 — 스크린샷에 거대한 타이포그래피 주변의 넉넉한 여백이 보입니다 장식적이거나 커브체 서체를 사용하지 마세요 — 스크린샷에 깔끔한 기하학적 grotesque-sans 헤드라인이 보입니다 피하기: 장난스럽거나 캐주얼한 언어 피하기: 둥글거나 통통한 모양 피하기: 지나치게 장식적인 서체 10
팩 안의 실제 스크린샷
桌面首屏（hero） 桌面滚动分段（90% viewport 步进，作为视觉证据） 桌面滚动分段（90% viewport 步进，作为视觉证据） 桌面滚动分段（90% viewport 步进，作为视觉证据） 桌面滚动分段（90% viewport 步进，作为视觉证据） 桌面滚动分段（90% viewport 步进，作为视觉证据） 桌面滚动分段（90% viewport 步进，作为视觉证据） 桌面滚动分段（90% viewport 步进，作为视觉证据） 桌面滚动分段（90% viewport 步进，作为视觉证据） 移动首屏 실제 페이지에서 캡처 · 실 computed styles
11
System Prompt
이 사이트는 Drog5의 프리미엄 크리에이티브 에이전시 포트폴리오로, 날카로운 블루 악센트(#0000D5) 하나를 더한 냉엄한 고대비 흑백 팔레트가 특징입니다. 타이포그래피는 결정적인 특징입니다: 거대하고 대담하며 촘촘한 자간의 grotesque-sans 헤드라인(예: DroteskNo5)이 시야를 지배하며, 종종 최대의 임팩트를 위해 중앙 정렬됩니다. 레이아웃은 넉넉한 여백의 텍스트 블록과 교차하는 일련의 풀블레이드 사진 섹션으로 구성됩니다. 핵심 디자인 규칙은 다음과 같습니다: 사각형 모서리의 절대적 사용(보더 라디우스 없음), 엄격한 미니멀 컬러 팔레트, 표시용 텍스트의 거대한 규모. 핵심 금지 사항: 절대 둥근 UI 요소를 사용하지 말 것, 절대 다색 팔레트를 사용하지 말 것, 절대 작거나 가벼운 표시용 타이포그래피를 사용하지 말 것, 절대 복잡한 그리드나 작은 카드로 레이아웃을 어지럽히지 말 것.
더 보기 en · zh-CN · zh-TW · ja · ko
OpenDesign · curated web aesthetics for AI-readable design DNA · opendesign.cc
왜 수록: 이 사이트는 거대하고 대담한 타이포그래피와 엄격한 미니멀리즘을 활용하여 창의적 권위와 규모를 전달하는 마스터클래스입니다.
