큐레이션 · 오픈 · 무료

Vividand

대담한 타이포그래피와 3D 글래스 액센트로 정의되는 프리미엄 다크 모드 에이전시 포트폴리오입니다.

AgencyPremiumFintechDark ModeBold Typography
Vividand 스크린샷
↓ 디자인 시스템 다운로드 (51 MB)OpenDesign 에서 열기

원본 사이트: https://vividand.co

📦 팩 내용 보기 →

01

디자인 DNA

프리미엄전략적에이전시핀테크대담한

보이지 않는 프레임워크를 구축하는 고급 건축 스튜디오.

02

컬러

#FFFDF9Ink
#6F879CInk soft
#101010BG
#1a1a1aBG soft
rgba(255, 253, 249, 0.2)Line

심층 차콜이 레이아웃을 기반으로 하며, 고대비 오프화이트 텍스트가 절대적인 가독성과 프리미엄 느낌을 보장합니다.

03

타이포그래피

geometric-sans

보조 내비게이션과 레이블에는 대문자를 사용합니다 · 대형 디스플레이 텍스트에는 좁은 자간을 유지합니다

04

여백

4px
8px
16px
24px
32px
48px
64px
96px

주요 섹션 간 넉넉한 수직 간격(48px-96px)이 호흡 가능한 시네마틱 느낌을 만듭니다.

05

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

sm · 15px
md · 15px
lg · 15px
pill · 999px

최소한의 1px 실선을 사용하며, 수평 구분선에 엄격히 저불투명도 화이트를 적용합니다.

06

레이아웃

1280container
12columns
24pxgutter
768 / 1024breakpoints

히어로에는 비대칭 분할 레이아웃, 풀폭 목록에는 왼쪽 정렬 텍스트와 수평 구분선을 사용합니다.

07

모션과 인터랙션

220msmicro
400mssmall
800msmedium
cubic-bezier(0.52, 0.01, 0, 1)easing

텍스트 블록의 느린 페이드인 · 3D 요소의 부드러운 cubic-bezier 트랜스폼 · UI 트랜지션의 선명한 선형 투명도 변화

인터랙티브 요소의 은은한 투명도 변화입니다. · 최소한의 시각적 피드백이며, 트랜지션 효과에 의존합니다.

08

컴포넌트

09

보이스와 금지 목록

10

팩 안의 실제 스크린샷

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

11

System Prompt

Vivid+Co를 위한 프리미엄 에이전시 포트폴리오로, 다크 차콜 배경(#101010)과 고대비 오프화이트 타이포그래피(#FFFDF9)가 특징입니다. 시각 시스템은 기하학적 고딕체를 사용하여 대담하고 현대적인 미학을 창출합니다. 3D 글拉斯 렌더 액센트와 깔끔한 수평 구분선이 특징입니다. 중요한 제약 사항: 세리프 서체 사용 금지, 밝은 액센트 색상 사용 금지, 무거운 드롭 섀도우 적용 금지, 그리고 시네마틱하고 프리미엄 느낌을 유지하기 위해 넉넉한 수직 간격을 유지합니다.

이 감각을 당신의 에이전트에

이 디자인의 기계 판독 가능한 사양——색상·타이포·모션까지——을 그대로 AI 에이전트에 전달하세요.

OpenDesign 스킬 ↗ · 이 팩 (에이전트용) ↗

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