← OpenDesign
큐레이션 · 오픈 · 무료
Empower Me
대형 타이포그래피와 사진 스토리텔링을 활용하여 신용 및 재정적 잠재력을 명확히 설명하는, 대담하고 고대비의 핀테크 플랫폼.
Fintech Bold Typography Dark Mode Clean App UI
01
디자인 DNA
대담한 강력한 접근성 있는 현대적인 신뢰할 수 있는
슬릭한 다크 수트에 밝은 노란색 포켓 스퀘어를 착용한, 대담하고 강력한 금융 자문가.
02
컬러
#E4E24EAccent
#FFFFFFInk
#171616BG
#F7F5EFBG soft
#FDFDF6BG quiet
#64635CMuted
rgba(16,15,15,1.0)Line
단일의 선명하고 네온에 가까운 차트루즈 악센트를 통해 시선을 주요 액션으로 유도하는 고대비 다크 모드입니다.
03
타이포그래피
geometric-sans · grotesque-sans
display 96px · 900heading 48px · 900body 16px · 400큰 헤드라인에는 좁은 자간(-0.6px ~ -1px)을 사용 · 내비게이션과 작은 라벨에는 대문자 트래킹(+1.2px) 적용 · UI 요소에는 깔끔한 고딕체를 대형 기하학적 디스플레이 폰트와 조합
04
여백
4px
8px
16px
24px
32px
48px
64px
96px
주요 콘텐츠 블록 주변과 히어로 섹션 내부에 넉넉한 패딩을 적용합니다.
05
표면 (라운드 / 그림자 / 경계선)
sm · 4px
md · 16px
lg · 24px
pill · 99999px
다크 히어로와 라이트 섹션을 구분하는 얇고 고대비의 테두리(2px)입니다.
06
레이아웃
1280 container
12 columns
24px gutter
768 / 1024 breakpoints
전체 폭의 다크 히어로 섹션이 3열 피처 그리드가 포함된 라이트한 중앙 콘텐츠 영역으로 전환됩니다.
07
모션과 인터랙션
150ms micro
300ms small
600ms medium
cubic-bezier(0.4, 0, 0.2, 1) easing
hover 및 focus 상태에서의 매끄러운 색상 전환
버튼과 링크의 부드러운 배경색 전환. · 미세한 이징을 적용한 즉각적인 반응.
08
컴포넌트
button 선명한 차트루즈 배경, 다크 텍스트, 그리고 굵은 대문자 트래킹을 적용한 알약 형태. card 넉넉한 내부 패딩과 장난기 있는 손그림 스타일의 일러스트를 사용한 라운드 처리된 라이트 카드. chip 아이콘과 텍스트가 포함된 작은 부동 배지로, 주로 알약 형태. hero 거대한 흰색 헤드라인과 데이터 배지가 작게 포함된, 부동하는 비대칭 사진 초상화 콜라주를 특징으로 하는 대형 다크 섹션.
09
보이스와 금지 목록
톤 강력하고 직접적이며 접근성 있는 어조로, 복잡한 금융 개념을 간단하고 친숙한 언어로 설명합니다. 헤드라인 극도로 굵고 간결하며 혜택을 강조하는 스타일로, 브랜딩을 위해 상표 기호를 자주 사용합니다. CTA 선명한 색상과 함께 대문자로 작성된 강력하고 행동 지향적인 명령형 동사. 얇고 섬세한 폰트를 사용하지 마세요 — 스크린샷에서는 대형이고 굵은 타이포그래피가 보입니다. 복잡하고 다채로운 팔레트를 사용하지 마세요 — 스크린샷에서는 엄격한 다크/흰색/차트루즈 색상 체계가 보입니다. 날카롭고 네모난 모서리를 사용하지 마세요 — 스크린샷에서는 크게 둥글어진 알약 형태의 버튼과 카드가 보입니다. 작고 미세한 CTA를 사용하지 마세요 — 스크린샷에서는 크고 고대비의 노란색 버튼이 보입니다. 밀도 높고 텍스트가 많은 레이아웃을 사용하지 마세요 — 스크린샷에서는 넉넉한 여백과 큰 이미지가 보입니다. 본문 텍스트에 세리프 폰트를 사용하지 마세요 — 스크린샷에서는 대담한 산세리프 디스플레이 및 고딕 본문 폰트만 사용됩니다. 피하기: 지나치게 전문적인 용어 피하기: 수동태 피하기: 일반적인 기업적 표현
10
팩 안의 실제 스크린샷
桌面首屏(hero) 桌面滚动分段(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
이것은 다크 모드 미학과 함께 단일의 선명한 차트루즈 악센트 컬러(#E4E24E)를 활용하여 사용자의 주요 액션으로 주의를 유도하는 핀테크 플랫폼 디자인 시스템입니다. 타이포그래피는 본문을 위한 더 깔끔한 고딕체와 결합된 대형, 굵은 기하학적 산세리프 헤드라인으로 정의됩니다. 레이아웃은 넉넉한 간격, 고대비 섹션 전환, 그리고 사실적인 사진과 장난기 있는 둥근 UI 컴포넌트의 조합을 특징으로 합니다. 중요 금지 사항: 여러 경쟁 악센트 색상 사용 금지; 헤드라인에 얇고 섬세한 타이프페이스 사용 회피; 버튼이나 카드에 절대 날카롭고 네모난 모서리 사용 금지. 이 시스템은 직접적인 언어와 임팩트 있는 시각적 계층을 통해 대담하고 강력한 어조를 우선시합니다.
더 보기
en · zh-CN · zh-TW · ja · ko
OpenDesign · curated web aesthetics for AI-readable design DNA · opendesign.cc
왜 수록: 이 사이트는 현대 핀테크에서 대담한 타이포그래피와 미니멀한 색상 사용의 강력한 예시로, 매우 인상적이고 접근성 높은 브랜드 아이덴티티를 구축합니다.