← OpenDesign
큐레이션 · 오픈 · 무료
Danielsun
대담하고 과장된 타이포그래피와 생동감 있는 옐로우 그라디언트를 활용한 표현적인 디자인 포트폴리오.
Portfolio Bold Typography Expressive Studio Web3
01
디자인 DNA
대담한 표현적인 친근한 모던한 고대비의
거대한 타이포그래피와 생동감 있는 옐로우 그라디언트를 사용하여 강렬하고 에너지 넘치는 존재감을 만드는, 대담한 고대비 개인 포트폴리오입니다.
02
컬러
#000000Ink
#808080Ink soft
#FFFFFFBG
#F5F5F5BG soft
#A6A6A6Muted
rgba(0,0,0,0.12)Line
선명한 블랙과 화이트를 주로 사용하는 고대비 팔레트에, 생동감 있는 옐로우 그라디언트를 포인트로 활용합니다.
03
타이포그래피
grotesque-sans · humanist-sans
display 88px · 900body 18px · 400subtitle 28px · 400대형 디스플레이 텍스트에는 극도로 굵은(900) 두께를 사용합니다. · 대형 디스플레이 사이즈에는 타이트한(음수) 자간을 적용합니다. · 대문자(all-caps)는 거대한 디스플레이 텍스트에만 제한하여 사용합니다.
04
여백
4px
8px
10px
16px
20px
24px
32px
40px
64px
96px
기본 4px 그리드를 사용하며, 섹션에는 풍부한 패딩(32px, 40px)을 적용합니다.
05
표면 (라운드 / 그림자 / 경계선)
sm · 14px
md · 24px
lg · 80px
pill · 999px
보이는 테두리 없음
0px 19px 8px 0px rgba(0, 0, 0, 0.3) · 0px 64px 128px 0px rgba(0, 0, 0, 0.25) · inset 0px 6px 6px 0px rgb(184, 184, 184)
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
모든 인터랙티브 요소에 부드러운 트랜지션 적용(모든 592개 요소에 transition 속성 적용).
인터랙티브 요소에 섬세한 밝기 또는 크기 변화. · 즉각적인 시각적 피드백.
08
컴포넌트
button 어두운 배경에 밝은 옐로우 텍스트를 사용하는 Pill 형태 버튼. card 클라이언트 로고용으로, 글로시한 3D 스타일의 원형 또는 Pill 형태 카드. hero 생동감 있는 옐로우 대각선 그라디언트 위에 거대하고 굵은 타이포그래피를 배치한 풀스크린 히어로.
09
보이스와 금지 목록
톤 친근하고 캐주얼하며, 매우 자신감 있는 어조. 헤드라인 거대하고 굵은, 대문자 문장. CTA 직관적이고 행동을 유도하는 스타일, 밝은 옐로우 강조 사용. 작고 가벼운 타이포그래피를 사용하지 마세요 — 스크린샷은 대신 거대하고 굵은(두께 900) 디스플레이 텍스트를 보여줍니다. 채도 낮은 모노크롬 팔레트를 사용하지 마세요 — 스크린샷은 대신 히어로 영역을 지배하는 생동감 있는 옐로우 그라디언트를 보여줍니다. 일반적인 사각형 버튼을 사용하지 마세요 — 스크린샷은 대신 둥근 Pill 형태 버튼을 보여줍니다. 플랫한 2D 아이콘을 사용하지 마세요 — 스크린샷은 대신 글로시한 3D 스타일의 클라이언트 로고를 보여줍니다. 히어로 영역에 복잡한 다단계 그리드를 사용하지 마세요 — 스크린샷은 대신 가운데 정렬된 풀폭 타이포그래피를 보여줍니다. 미세하고 얇은 테두리를 사용하지 마세요 — 스크린샷은 대신 강한 그림자와 굵은 색상 블록을 보여줍니다. 피하기: 격식 있는 기업 언어 피하기: 작고 섬세한 타이포그래피 피하기: 채도 낮은 팔레트 피하기: 표현적 요소가 없는 딱딱한 그리드 중심 레이아웃
10
팩 안의 실제 스크린샷
桌面首屏(hero) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(90% viewport 步进,作为视觉证据) 桌面滚动分段(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
이것은 SaaS 및 Web3 디자인 파트너를 위한 대담하고 표현적인 디자인 포트폴리오입니다. 디자인 DNA는 grotesque-sans 계열의 거대하고 초대양한 타이포그래피(두께 900)와, 단색 블랙(#000000)과 화이트(#FFFFFF)의 선명한 고대비 팔레트, 그리고 생동감 있는 옐로우 그라디언트를 특징으로 합니다. 레이아웃은 풍부한 패딩과 가운데 정렬된 섹션을 사용하여 넉넉합니다. 중요 금지 사항: 절대 작고 가벼운 타이포그래피를 사용하지 마세요; 절대 채도 낮은 기업용 팔레트를 사용하지 마세요; 클라이언트 작업에 플랫한 2D 아이콘을 사용하지 마세요—항상 글로시한 3D 스타일 요소를 사용하세요. 딱딱하고 격식 있는 레이아웃은 피하고, 거대한 텍스트가 있는 표현적이고 풀폭인 섹션을 선호하세요.
더 보기
en · zh-CN · zh-TW · ja · ko
OpenDesign · curated web aesthetics for AI-readable design DNA · opendesign.cc
왜 수록: 이 사이트는 거대한 타이포그래피와 생동감 있는 컬러를 활용하여 기억에 남는, 에너지 넘치는 브랜드 프레즌스를 만드는 탁월한 포트폴리오 디자인의 예시입니다.