큐레이션 · 오픈 · 무료

Hume AI

음성 AI에 감정 인텔리전스를 통합하기 위한 따뜻하고 정교한 플랫폼.

01

디자인 DNA

인간 감정과 기계 지능을 연결하는 우아한 연구 실험실.

02

컬러

표현력 있는 그라데이션 악센트가 적용된 따뜻한 중간색.

03

타이포그래피

humanist-sans · monospace

• display56px · 400
• headline40px · 400
• subheadline20px · 400
• body16px · 400
• caption12px · 400

04

여백

섹션 간 넉넉한 수직 간격.

05

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

카드와 입력 필드에 주로 적용되는 미묘한 1px 테두리.

06

레이아웃

넉넉한 여백을 갖춘 중앙 정렬 단일 열 흐름.

07

모션과 인터랙션

인터랙티브 요소의 부드러운 색상 전환 · hover 가능한 카드의 transform 전환

인터랙티브 요소의 color 및 background-color 전환. · 미묘한 transform 또는 opacity 변화.

08

컴포넌트

• button 알약 모양 버튼. 검정색 채움(흰색 텍스트) 또는 텍스트 전용.
• card 둥근 모서리(12-16px)와 미묘한 그림자가 적용된 부드러운 색상의 카드.
• hero 큰 추상적 그라데이션 그래픽 위에 중앙 정렬된 텍스트.

09

보이스와 금지 목록

• 톤 과학적이고 정교하며 친근함.
• 헤드라인 연구와 기능을 강조하는 명확하고 단언적인 문장.
• CTA 직접적이고 행동 지향적이며, 종종 고정폭 대문자 텍스트 사용.

• 차갑고 순백색 배경을 사용하지 마세요 — 스크린샷은 대신 따뜻한 크림(#FFF9F3)을 보여줍니다.
• 단일 단색 악센트를 사용하지 마세요 — 스크린샷은 대신 다색 그라데이션과 파스텔 카드를 보여줍니다.
• 경직된 기하학적 산세리프체를 사용하지 마세요 — 스크린샷은 더 자연스러운 humanist-sans 폰트를 보여줍니다.
• 무거운 drop shadow를 사용하지 마세요 — 스크린샷은 대신 미니멀하고 평평한 표면에 매우 미묘한 테두리를 보여줍니다.
• 다크 모드를 사용하지 마세요 — 스크린샷은 대신 밝고 따뜻한 인터페이스를 보여줍니다.
• 복잡한 레이아웃을 사용하지 마세요 — 스크린샷은 대신 넉넉한 여백과 중앙 정렬된 콘텐츠를 보여줍니다.
• 피하기: 구어체 언어
• 피하기: 과장된 또는 공격적인 마케팅 문구
• 피하기: 밀도 높은 단락

10

팩 안의 실제 스크린샷

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

11

System Prompt

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