小專案

做著玩的東西,有的有用,有的純粹好玩。

如果你想聊聊,不管是品味、AI、創業、或任何你正在想的事,歡迎約一杯咖啡。

Let me know how I can help you.

預約 Coffee Chat

Airbnb 設計特色

Airbnb 的設計以溫暖、圓潤、克制的紅色聞名。以下用三個互動展示,拆解其最具辨識度的視覺語言。

Three-Layer Shadow

Airbnb 的卡片陰影由三層組成:第一層 1px 實線邊框感、第二層柔和擴散、第三層深度錨定。分開看各自微弱,合起來卻讓卡片自然浮起。

1
Border
0 0 0 1px
rgba(0,0,0,0.02)
2
Diffuse
0 2px 6px
rgba(0,0,0,0.04)
3
Anchor
0 4px 8px
rgba(0,0,0,0.1)
All
Combined
三層疊加

Rausch Red Restraint

Rausch Red (#ff385c) 得名於 Airbnb 舊金山總部所在的 Rausch Street。在整個介面中,這個紅色只出現在搜尋按鈕和 CTA — 越少用,越有力。

大安森林公園旁小屋
整套公寓 · 2 位
$2,800 / 晚
信義區景觀套房
獨立房間 · 1 位
$1,950 / 晚
北投溫泉旅宿
整套公寓 · 4 位
$4,200 / 晚

整個列表區域沒有任何紅色 — 只有搜尋按鈕和 CTA 使用 Rausch Red

Radius Gallery

Airbnb 大量使用圓角,從按鈕的 8px 到卡片的 20px 再到控制項的 50%,營造溫暖、友善的視覺感。

8px
Buttons
14px
Images
20px
Cards
32px
Panels
50%
Controls