CURATED · OPEN · FREE

Hume AI

A warm, sophisticated platform for embedding emotional intelligence into voice AI.

aivoice

↓ Download design system (5 MB)Open in OpenDesign

Visit: https://www.hume.ai

📦 Browse pack contents →

Identity DNA

emotional intelligencevoice AIresearchopen-source

An elegant research laboratory that bridges human emotion and machine intelligence.

Color

#222222Ink

#666666Ink soft

#FFF9F3BG

#999999Muted

rgba(34,34,34,0.15)Line

Warm neutrals with expressive gradient accents.

Typography

humanist-sans · monospace

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

Spacing

4px

8px

12px

16px

24px

32px

48px

64px

96px

Generous vertical spacing between sections.

Surfaces

sm · 4px

md · 8px

lg · 16px

pill · 9999px

Subtle 1px borders, primarily on cards and inputs.

Layout

1280container

12columns

24pxgutter

768 / 1024breakpoints

Centered, single-column flow with generous white space.

Motion & Interaction

150msmicro

200mssmall

300msmedium

cubic-bezier(0.4, 0, 0.2, 1)easing

Smooth color transitions on interactive elements · Transform transitions on hoverable cards

Color and background-color transitions on interactive elements. · Subtle transform or opacity changes.

Components

button Pill-shaped buttons, either filled black with white text or text-only.
card Softly colored cards with rounded corners (12-16px) and subtle shadows.
hero Centered text over a large, abstract gradient graphic.

Voice & Don'ts

Tone Scientific, sophisticated, and approachable.
Headlines Clear, declarative statements that emphasize research and capability.
CTAs Direct and action-oriented, often using monospaced uppercase text.

Don't use a cold, pure white background — screenshot shows a warm cream (#FFF9F3) instead.
Don't use a single flat accent color — screenshot shows multi-color gradients and pastel cards instead.
Don't use rigid, geometric sans-serifs — screenshot shows a more organic humanist-sans font.
Don't use heavy drop shadows — screenshot shows minimal, flat surfaces with very subtle borders instead.
Don't use dark mode — screenshot shows a light, warm interface instead.
Don't use cluttered layouts — screenshot shows generous white space and centered content instead.
Avoid: Colloquial language
Avoid: Loud or aggressive marketing claims
Avoid: Dense paragraphs

Inside the pack — real screenshots

Hume AI — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

Captured from the live site · real computed styles

System prompt

Hume AI is a research-focused AI platform for voice emotional intelligence. The design uses a warm cream background (#FFF9F3) paired with dark ink text (#222222). Typography is a humanist-sans paired with a monospace for technical labels. The interface relies on subtle pastel gradients and soft-colored cards rather than a single dominant accent color. Key features include generous white space, centered layouts, and pill-shaped buttons. Critical constraints: Avoid cold pure-white backgrounds, avoid flat single-color accents, avoid rigid geometric typography, avoid heavy shadows, avoid dark mode, and avoid cluttered layouts. The voice is scientific yet approachable, emphasizing open-source research and cutting-edge capabilities.

Bring this taste to your agent

Hand your AI agent a machine-readable spec of this design — tokens, type, motion, the whole DNA.

OpenDesign skill ↗ · This pack for agents ↗

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