GetYourGuide color palette
TravelGetYourGuide uses a vibrant and distinctive red as its primary brand color, complemented by a clean, modern palette of neutrals and accent tones for digital interfaces. The color system is designed for high visibility and clarity across web and mobile platforms.
getyourguide.comGetYourGuide colors
Click any swatch to copy its hex. Hover for RGB and HSL.
Brand colors
The colors people recognise.- GetYourGuide RedPrimary255, 75, 62
- GetYourGuide YellowSecondary255, 214, 0
- GetYourGuide TealAccent0, 178, 169
Surfaces
Page, cards and dividers.- GetYourGuide WhiteBackground255, 255, 255
- GetYourGuide Light GraySurface248, 248, 248
- GetYourGuide Border GrayBorder224, 224, 224
Text
Three tiers of copy.- GetYourGuide BlackText35, 35, 35
- GetYourGuide Medium GraySecondary text107, 107, 107
- GetYourGuide Muted GrayMuted text168, 168, 168
Semantic
Feedback and state colors.- GetYourGuide GreenSuccess0, 196, 140
- GetYourGuide OrangeWarning255, 180, 0
- GetYourGuide Error RedError224, 46, 46
- GetYourGuide BlueInfo20, 120, 255
Use GetYourGuide's colors in your project
Pick a format, copy or download. Everything below is generated from the exact hex values above.
getyourguide-palette-colors.css · Paste into your global stylesheet.
:root {
--info: #1478FF;
--error: #E02E2E;
--accent: #00B2A9;
--border: #E0E0E0;
--primary: #FF4B3E;
--success: #00C48C;
--surface: #F8F8F8;
--warning: #FFB400;
--secondary: #FFD600;
--text-muted: #A8A8A8;
--background: #FFFFFF;
--text-primary: #232323;
--text-secondary: #6B6B6B;
}Contrast and accessibility
Every text tone tested against every surface, per WCAG 2.1.
Text on background
Needs 4.5:1 for body text
15.7:1
Pass
Text on surface
Needs 4.5:1 for body text
14.8:1
Pass
Secondary text on background
Needs 4.5:1 for body text
5.3:1
Pass
Secondary text on surface
Needs 4.5:1 for body text
5.0:1
Pass
Muted text on background
Needs 3:1 for large text
2.4:1
Fail
Muted text on surface
Needs 3:1 for large text
2.2:1
Fail
GetYourGuide gray and neutral colors
The quiet part of the GetYourGuide palette: page background, card surfaces, dividers and the three text tones that sit on them. Click a value to copy it.
- GetYourGuide WhiteBackground
- HEX
- RGB
- HSL
- GetYourGuide Light GraySurface
- HEX
- RGB
- HSL
- GetYourGuide Border GrayBorder
- HEX
- RGB
- HSL
- GetYourGuide BlackText
- HEX
- RGB
- HSL
- GetYourGuide Medium GraySecondary text
- HEX
- RGB
- HSL
- GetYourGuide Muted GrayMuted text
- HEX
- RGB
- HSL
About GetYourGuide's colors
GetYourGuide's palette is anchored by a bold red, contrasted with bright yellow and teal for vibrancy and clarity. The supporting neutrals ensure readability and a modern, approachable interface.
Primary red is complemented by yellow and teal for visual hierarchy.
Neutrals provide balance and support content legibility.
Accent colors are used sparingly for calls to action and highlights.
Psychology
The red evokes excitement, energy, and action, aligning with travel and discovery. Yellow and teal add friendliness and trust, supporting a positive user experience.
Evolution
The core red has remained consistent since the brand's early years, ensuring strong recognition. The palette has evolved to include more nuanced neutrals and accent tones for digital clarity.
Where GetYourGuide uses each color
- Primary
Used for main action buttons, logo, and key highlights across the website and app.
- Secondary
Appears in secondary buttons, highlights, and promotional banners.
- Accent
Used for links, icons, and select UI elements to draw attention.
- Backgrounds
White and light gray backgrounds are used for content areas and cards.
- Text
Primary black and gray tones are used for headings, body text, and muted information.
- Semantic
Green, orange, red, and blue are used for status messages and notifications.
GetYourGuide color questions
Hex codes, RGB values, neutrals and how to use the palette.
The official GetYourGuide brand color hex code is #FF4B3E, known as GetYourGuide Red.
GetYourGuide Red (#FF4B3E) is RGB(255, 75, 62) and CMYK(0, 71, 76, 0).
GetYourGuide uses #F8F8F8 (Light Gray), #E0E0E0 (Border Gray), and #232323 (Black) as its primary neutral tones for backgrounds, borders, and text.
Use GetYourGuide Red (#FF4B3E) for primary actions and brand presence, with yellow and teal as accents. Neutrals should dominate backgrounds and text for optimal readability.
The secondary color is GetYourGuide Yellow, #FFD600, and the accent is GetYourGuide Teal, #00B2A9. Together with the primary they make up the three brand colors at the top of this page.
4 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 GetYourGuide's colors consistently when it generates UI.
Make something in the spirit of GetYourGuide
Start from this palette's mood and get an original 13-color system for your own project, contrast-checked and ready to export.