← OpenDesign
큐레이션 · 오픈 · 무료
July Fund
대형 세리프 디스플레이 타이포그래피와 깔끔한 카드 기반 레이아웃을 갖춘 격조 있는 에디토리얼 스타일의 벤처 쎄이탈 펀드 웹사이트입니다.
Editorial Curation Clean Refined Consumer
01
디자인 DNA
벤처 캐피탈 투자 에디토리얼 격조 있는 큐레이션
클래식 에디토리얼 타이포그래피와 깔끔한 디지털 카드 레이아웃을 조화시킨 현대적이고 큐레이션된 투자 저널.
02
컬러
#56D270Accent
#433E3CInk
#EEE7E5BG
#F0E7E4BG soft
#9A9390Muted
rgba(67, 62, 60, 0.1)Line
따뜻하고 무드 있는 중성 팔레트에 상호작용 요소와 태그를 위한 단일 밝은 그린 악센트를 적용합니다.
03
타이포그래피
didone-serif · humanist-sans
display 56px · 400h2 36px · 400body 16px · 400small 10px · 700작은 UI 요소와 배지에는 넓은 자간의 대문자를 사용합니다. · 본문 텍스트는 넉넉한 행 높이를 유지하여 높은 가독성을 확보합니다. · 대형 디도네 세리프는 주요 디스플레이 텍스트로 엄격히 예약합니다.
04
여백
4px
8px
12px
16px
20px
24px
32px
40px
60px
4px 기본 단위를 사용하여 모든 카드 구성 요소에 일관된 패딩을 적용합니다.
05
표면 (라운드 / 그림자 / 경계선)
sm · 8px
md · 12px
lg · 20px
pill · 999px
카드에 눈에 띄는 하드 테두리는 없습니다. 깊이는 배경 대비와 넉넉한 둥근 모서리를 통해 구현합니다.
06
레이아웃
1280 container
12 columns
24px gutter
768 / 1024 breakpoints
데스크톱에서는 카드의 다중 열 메이슨리 그리드를 사용하고, 모바일에서는 단일 열로 쌓입니다.
07
모션과 인터랙션
220ms micro
400ms small
800ms medium
cubic-bezier(0.25, 0.1, 0.25, 1) easing
hover 시 CSS background-color 및 transform 트랜지션 · 페이지 전환 시 부드러운 opacity 트랜지션
배경색 트랜지션과 미세한 요소 이동. · 모든 상호작용 요소에서 표준 커서 포인터 상호작용.
08
컴포넌트
button 대문자 텍스트, 1px 테두리, 투명 배경을 가진 알약 모양 버튼. card 배경 대비를 통한 미세한 변화(예: 라이트 모드와 다크 모드 카드)와 중앙 정렬된 텍스트를 가진 둥근 모서리 컨테이너. chip 밝은 색상(그린 또는 퍼플)의 작은 알약 모양 배지로, 대문자, 넓은 자간의 텍스트를 가집니다. input 제공된 뷰에서 두드러지게 나타나지 않습니다. hero 따뜻한 중성 배경 위에 짧은 설명 단락을 중심으로 대형 세리프 워드마크를 배치합니다.
09
보이스와 금지 목록
톤 권위 있으면서도 접근 가능한 톤으로, 하이엔드 금융과 현대 기술을 조화시킵니다. 헤드라인 대형 클래식 세리프 워드마크와 소문자 뉴스 제목. CTA 절제된, 대문자, 얇은 테두리의 알약 모양 버튼. 날카로운 사각형 모서리를 사용하지 마세요. 스크린샷에는 카드에 넉넉한 20px 둥근 모서리가 보입니다. 본문 텍스트에 전체 대문자를 사용하지 마세요. 스크린샷에는 작은 배지와 날짜에만 전체 대문자가 사용됩니다. 무거운 드롭 섀도우를 사용하지 마세요. 스크린샷에는 배경색 대비로 정의된 플랫 표면이 보입니다. 차갑고 임상적인 블루 팔레트를 사용하지 마세요. 스크린샷에는 따뜻하고 우아한 중성색과 그린 악센트가 사용됩니다. 디스플레이 텍스트에 기형적 산세리프를 사용하지 마세요. 스크린샷에는 클래식 디도네 세리프가 사용됩니다. 고대비 다색 그래디언트를 사용하지 마세요. 스크린샷에는 단색 배경과 때때로 부드러운 이미지 텍스처가 사용됩니다. 피하기: 여러 경쟁 색상으로 인터페이스를 복잡하게 하지 마세요. 피하기: 주요 헤드라인에 현대적 산세리프를 사용하지 마세요. 피하기: 컨테이너에 날카롭고 모난 모서리를 사용하지 마세요.
10
팩 안의 실제 스크린샷
桌面首屏(hero) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 移动首屏 실제 페이지에서 캡처 · 실 computed styles
11
System Prompt
이 디자인 시스템은 격조 있는 에디토리얼 스타일의 벤처 캐피탈 펀드 웹사이트를 나타냅니다. 따뜻하고 무드 있는 중성 팔레트(#EEE7E5 배경, #433E3C 잉크)를 중심으로 상태 배지와 태그를 위한 밝은 그린 악센트(#56D270)를 대조시킵니다. 타이포그래피는 디스플레이 요소를 위한 대형 우아한 디도네 세리프와 본문 카피를 위한 깔끔한 휴머니스트 산세리프로 구성됩니다. 레이아웃은 넉넉한 20px 둥근 모서리를 가진 카드 기반 그리드를 기반으로 하며, 깊이를 위해 그림자보다는 배경색 변화에 의존합니다. 버튼은 절제된, 알약 모양, 대문자입니다. 중요한 주의사항: 날카로운 모서리를 사용하지 마세요. 무거운 드롭 섀도우를 적용하지 마세요. 대형 디스플레이 헤드라인에 현대적 산세리프를 사용하지 마세요.
더 보기
en · zh-CN · zh-TW · ja · ko
OpenDesign · curated web aesthetics for AI-readable design DNA · opendesign.cc
왜 수록: 이 사이트는 클래식 에디토리얼 타이포그래피와 현대적이고 깔끔한 디지털 카드 레이아웃의 조화를 보여주는 강력한 사례입니다.