[Audit 010] Airbnb Design: The Logic of Belonging

Design Philosophy

Airbnb 的设计哲学是"Belonging Anywhere"（四海为家）。核心理念是创造温暖、友好、可信的用户体验。品牌红传达热情与欢迎，圆角设计传递亲和力。每个细节都为让用户感受到"归属"——就像回到自己的家一样舒适自在。

Design Tokens

Brand Colors

#ff5a5f

#e04348

#222222

Grayscale

#484848

#767676

#bebebe

#dddddd

#f7f7f7

Typography

Circular — Airbnb's Signature

Weights: 400, 600, 700

Spacing (4px Grid)

4 / 8 / 12 / 16 / 20 / 24 / 32 / 40 / 48

Button Styles

/* Airbnb Primary Button */
.airbnb-btn-primary {
    background: var(--airbnb-red);
    color: white;
    padding: 12px 24px;
    border-radius: 8px;
    font-weight: 600;
    transition: all 0.2s ease;
    border: none;
}

.airbnb-btn-primary:hover {
    background: var(--airbnb-red-dark);
    transform: scale(1.02);
    box-shadow: 0 4px 12px rgba(255, 90, 95, 0.3);
}

CSS Implementation

/* Warm Card with Shadow */
.airbnb-card {
    background: var(--airbnb-white);
    border: 1px solid var(--airbnb-gray-300);
    border-radius: 12px;
    transition: all 0.3s ease;
}

.airbnb-card:hover {
    border-color: var(--airbnb-red);
    box-shadow: 0 8px 24px rgba(255, 90, 95, 0.12);
    transform: translateY(-2px);
}

Key Insights

Rausch Red (#ff5a5f) 是 Airbnb 的标志性颜色，传达温暖与欢迎
12px 圆角创造友好、亲和的视觉感受
Circular 字体独特且易识别，强化品牌记忆
4px 网格系统确保设计的精确性和一致性
微阴影和悬停效果增添层次感和交互反馈
摄影作品在设计中扮演核心角色，展示真实体验