브랜드 가이드라인
Made의 디자인 시스템과 비주얼 아이덴티티
로고
에이전트 컬러
각 에이전트는 한눈에 알아볼 수 있는 고유한 컬러 아이덴티티를 가지고 있습니다.
Milo
Creative Director
Zara
Community Manager
Remi
Content Producer
Lila
Distribution Manager
에이전트 그라디언트
각 에이전트의 소개 페이지에 사용되는 그라디언트 배경입니다.
Milo
linear-gradient(to bottom right, #1e3a8a, #1e40af, #000000)
Zara
linear-gradient(to top left, #F29B28, #FEDB4D)
Remi
linear-gradient(to bottom right, #581c87, #6b21a8, #000000)
Lila
linear-gradient(to bottom right, #7f1d1d, #991b1b, #000000)
브랜드 컬러
인터페이스 전반에 사용되는 핵심 컬러입니다.
Made Dark
기본 배경
#0A0A0FMade Dark Secondary
보조 배경
#1A1A2EMade Dark Accent
액센트 배경
#16162AGradient Start
기본 그라디언트
#6366F1Gradient End
기본 그라디언트
#EC4899White
텍스트 & 테두리
#FFFFFF타이포그래피
폰트
기본 폰트
System UI
system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif
모노스페이스 폰트
Space Mono
기술적 요소, 데이터 표시, 코드에 사용됩니다
타입 스케일
컴포넌트
버튼
카드 & 글래스 이펙트
기본 카드
bg-[#1A1A2E] with border
글래스 카드
bg-white/5 backdrop-blur-lg
다크 글래스
bg-black/20 backdrop-blur-lg
테두리 반경
에이전트 아바타
각 AI 에이전트를 시각적으로 표현한 이미지입니다.

Milo

Zara

Remi

Lila
스페이싱 스케일
이펙트
글로우 이펙트
box-shadow: 0 0 30px rgba(99, 102, 241, 0.6)
호버 스케일
hover:scale-105 transition-transform