Airbnb Experiences color palette
TravelAirbnb Experiences uses a vibrant, approachable palette centered on its signature Rausch pink, complemented by warm neutrals and clear UI greys. The color system emphasizes friendliness, inclusivity, and clarity across digital and print touchpoints.
airbnb.comAirbnb Experiences colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- Airbnb Rausch PinkPrimary255, 90, 95
- Airbnb Babu TealSecondary0, 166, 153
- Airbnb Arches OrangeAccent252, 100, 45
Surfaces
Page, cards and dividers.- Airbnb WhiteBackground255, 255, 255
- Airbnb Cloud GraySurface247, 247, 247
- Airbnb Outline GrayBorder221, 221, 221
Text
Three tiers of copy.- Airbnb InkText72, 72, 72
- Airbnb CharcoalSecondary text118, 118, 118
- Airbnb Muted GrayMuted text176, 176, 176
Semantic
Feedback and state colors.- Airbnb Success GreenSuccess0, 132, 137
- Airbnb Warning YellowWarning255, 215, 0
- Airbnb Error RedError217, 57, 0
- Airbnb Info BlueInfo0, 122, 135
Use Airbnb Experiences's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
airbnb-experiences-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #007A87;
--error: #D93900;
--accent: #FC642D;
--border: #DDDDDD;
--primary: #FF5A5F;
--success: #008489;
--surface: #F7F7F7;
--warning: #FFD700;
--secondary: #00A699;
--text-muted: #B0B0B0;
--background: #FFFFFF;
--text-primary: #484848;
--text-secondary: #767676;
}Contrast and accessibility
Every text tone tested against every surface, per WCAG 2.1.
Text on background
Needs 4.5:1 for body text
9.1:1
Pass
Text on surface
Needs 4.5:1 for body text
8.5:1
Pass
Secondary text on background
Needs 4.5:1 for body text
4.5:1
Pass
Secondary text on surface
Needs 4.5:1 for body text
4.2:1
Fail
Muted text on background
Needs 3:1 for large text
2.2:1
Fail
Muted text on surface
Needs 3:1 for large text
2.0:1
Fail
Airbnb Experiences gray and neutral colors
The quiet part of the Airbnb Experiences palette: page background, card surfaces, dividers and the three text tones that sit on them. Click a value to copy it.
- Airbnb WhiteBackground
- HEX
- RGB
- HSL
- Airbnb Cloud GraySurface
- HEX
- RGB
- HSL
- Airbnb Outline GrayBorder
- HEX
- RGB
- HSL
- Airbnb InkText
- HEX
- RGB
- HSL
- Airbnb CharcoalSecondary text
- HEX
- RGB
- HSL
- Airbnb Muted GrayMuted text
- HEX
- RGB
- HSL
About Airbnb Experiences's colors
Airbnb Experiences' palette is built around a warm, energetic pink, supported by approachable teals and oranges, and grounded with soft greys. The system balances vibrancy for calls to action with calm neutrals for readability.
Primary pink contrasts with teal and orange for visual hierarchy.
Greys provide neutral backgrounds and structure.
Accent colors highlight actions and important information.
Psychology
The Rausch pink evokes warmth, friendliness, and excitement, making the brand feel welcoming. Teal and orange add energy and approachability, while greys ensure clarity and comfort.
Evolution
Airbnb's palette has remained consistent since its 2014 rebrand, with Rausch pink as the anchor. Minor adjustments to grey tones and accent colors have improved accessibility and digital clarity.
Where Airbnb Experiences uses each color
- Primary
Rausch pink is used for primary buttons, highlights, and key brand elements.
- Secondary
Babu teal appears in secondary buttons, icons, and supporting graphics.
- Accent
Arches orange is used for notifications, highlights, and select UI elements.
- Backgrounds
White and Cloud gray are used for page backgrounds and cards.
- Text
Ink and Charcoal are used for primary and secondary text throughout the UI.
- Semantic
Success green, warning yellow, error red, and info blue are used for status messages and alerts.
Airbnb Experiences color questions
Hex codes, RGB values, neutrals and how to use the palette.
The primary Airbnb Experiences brand color is Rausch pink, hex code #FF5A5F.
Rausch pink is RGB(255, 90, 95) and CMYK(0, 65, 60, 0). The hex code is #FF5A5F.
Airbnb uses Cloud gray (#F7F7F7), Outline gray (#DDDDDD), Ink (#484848), Charcoal (#767676), and Muted gray (#B0B0B0) for backgrounds, borders, and text. These provide a clean, accessible UI foundation.
Use Rausch pink (#FF5A5F) for primary actions and highlights, with supporting colors for hierarchy and clarity. Greys and neutrals should dominate backgrounds and text for accessibility.
The secondary color is Airbnb Babu Teal, #00A699, and the accent is Airbnb Arches Orange, #FC642D. Together with the primary they make up the three brand colors at the top of this page.
3 of 6 text and background pairings meet WCAG 2.1 AA contrast. The contrast section above shows every pairing with its exact ratio.
Use the export block on this page. It gives you CSS custom properties, a Tailwind config, W3C design tokens or a shadcn/ui theme built from these exact hex values, with copy and download buttons.
Yes. Export the Claude Code skill, Cursor rules or Codex prompt from the same block. The agent then applies Airbnb Experiences's colors consistently when it generates UI.
Make something in the spirit of Airbnb Experiences
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.