Back to Library
A

Airbnb

Airbnb

Visit Website

旅行短租平台。温暖珊瑚色强调,摄影驱动,圆润UI,亲和力强的设计。

珊瑚色强调摄影优先圆润UI温暖亲和旅行风格

Color Palette

primary
background
surface
text
muted
border

Typography

Heading FontCircular, system-ui, sans-serif
Body FontCircular, system-ui, sans-serif
Base Size16px
Line Height1.5
Weights400, 500, 600

Heading Scale

h1Airbnb Heading
h2Airbnb Heading
h3Airbnb Heading
h4Airbnb Heading

DESIGN.md

# Airbnb Design System

## Visual Theme & Atmosphere
Warm hospitality. The coral accent (#FF5A5F) radiates friendliness and trust. Photography dominates the visual hierarchy, with UI elements supporting rather than competing. The design feels like a welcoming host showing you around.

## Color Palette & Roles
| Token | Hex | Role |
|-------|-----|------|
| Primary | #FF5A5F | Brand coral, CTAs |
| Background | #FFFFFF | Clean canvas |
| Surface | #F7F7F7 | Panels, cards |
| Text | #222222 | Primary text |
| Muted | #717171 | Secondary text |
| Border | #DDDDDD | Light borders |

## Typography Rules
- **Heading Font**: Circular, system-ui, sans-serif
- **Body Font**: Circular, system-ui, sans-serif
- **Base Size**: 16px
- **Line Height**: 1.5

## Component Stylings
- **Buttons**: Coral bg, white text, rounded-full
- **Cards**: Image-heavy, rounded corners, shadow
- **Search**: Large, prominent, rounded

## Agent Prompt Guide
Use coral accents, image-heavy layouts, rounded UI elements, warm approachable styling.

Frequently Asked Questions

What is Airbnb's design style?

旅行短租平台。温暖珊瑚色强调,摄影驱动,圆润UI,亲和力强的设计。

What is Airbnb's primary color?

Airbnb uses #FF5A5F as primary color, #FFFFFF for background, and #222222 for text.

What fonts does Airbnb use?

Heading font: Circular, system-ui, sans-serif. Body font: Circular, system-ui, sans-serif. Base size: 16px.

How to use Airbnb design system in my project?

Click the Copy button above the DESIGN.md code block to copy the complete design specification. AI Coding tools like Cursor can directly read DESIGN.md to generate code matching Airbnb's style.

Explore More Design Systems

Discover 50+ curated design systems for your AI Coding projects.

View All Design Systems