EG_Circular_Icon_blue.png

Travel ignites our imagination – it engages the mind and body, inciting a sense of play and wonder. Our colors communicate that energy to our audience and spark a connection with our purpose.

Primary Colors

Our primary colors are an integral part of our visual brand equity. They should be used as a constant element that thread together all communications and experiences.

EG Dark Blue

HEX: 000099

RGB: 0, 0, 153

CMYK: 100, 98, 5, 6

PMS: 072 C

EG Aqua

HEX: 58DFB8

RGB: 88, 223, 184

CMYK: 55, 0, 40, 0

PMS: 3375 C

EG Brilliant Blue

HEX: 0000FD

RGB: 0, 0, 253

CMYK: 89, 77, 0, 0

PMS: 2132 C

EG Aqua should always be used in combination with one or both of our leading primary colors, EG Dark or Brilliant Blue. Shades of aqua should never be used by themselves.

Secondary Colors

Our secondary colors expand the versatility of our visual language. These colors can be used as background fills or additional colors alongside EG Dark and Brilliant Blue, but they should never overlap with EG Aqua.

Blue 3

HEX: 819FF5

RGB: 129, 159, 245

CMYK: 48, 33, 0, 0

Blue 5

HEX: B6DBFF

RGB: 182, 219, 255

CMYK: 25, 6, 0, 0

Example

Color Family

Our colors create versatility through unique combinations. Avoid using too many colors in one piece – limit yourself to three or less. Color combinations should create visual harmony and never feel overwhelming.

Below are a few examples of successful color combinations when applied to graphics. When dealing with text, always use colors that have high contrast for readability (scroll down to Accessibility Best Practices).

Combo 1

EG Dark Blue 

EG Brilliant Blue

EG Aqua (accent)

Combo 2

EG Aqua 

EG Brilliant Blue

EG Dark Blue (accent)

Combo 3

Blue 6

Blue 4

EG Brilliant Blue (accent)

EG Dark Blue

HEX: 000099

RGB: 0, 0, 153

CMYK: 100, 98, 5, 6

Blue 1

HEX: 000068

RGB: 0, 0, 104

CMYK: 100, 98, 21, 30

EG Brilliant Blue

HEX: 0000FD

RGB: 0, 0, 253

CMYK: 89, 77, 0, 0

Blue 3

HEX: 819FF5

RGB: 129, 159, 245

CMYK: 48, 33, 0, 0

Blue 2

HEX: 2169F9

RGB: 33, 105, 249

CMYK: 80, 61, 0, 0

Blue 4

HEX: 8AB4FF

RGB: 138, 180, 255

CMYK: 41, 22, 0, 0

Blue 5

HEX: B6DBFF

RGB: 182, 219, 255

CMYK: 25, 6, 0, 0

Blue 6

HEX: DFEDFF

RGB: 223, 237, 255

CMYK: 10, 3, 0, 0

Blue 7

HEX: EDF6FF

RGB: 237, 246, 255

CMYK: 5, 1, 0, 0

EG Aqua
Aqua 1

HEX: 15AFA0

RGB: 21, 175, 160

CMYK: 76, 6, 45, 0

HEX: 58DFB8

RGB: 88, 223, 184

CMYK: 55, 0, 40, 0

Aqua 2

HEX: 79F3CD

RGB: 121, 243, 205

CMYK: 44, 0, 31, 0

Aqua 3

HEX: B1EEE3

RGB: 177, 238, 227

CMYK: 28, 0, 15, 0

Aqua 4

HEX: EAFBF6

RGB: 234, 251, 246

CMYK: 7, 0, 4, 0

Additional Colors

Additional colors add dimension to a design, but they should never take up more than 10-15% of colors in one piece. They are not meant to replace a primary or secondary brand color.

 

Use additional colors sparingly. Do not use them for text, call-to-actions, or main differentiators.

 

Holidays or cultural elements with defining colors are a unique exception.
Vermilion 1

HEX: FF5741

RGB: 255, 87, 65

CMYK: 0, 81, 76, 0

Vermilion 2

HEX: FF825D

RGB: 255, 130, 93

CMYK: 0, 61, 64

Yellow 1

HEX: FAEB79

RGB: 250, 235, 121

CMYK: 4, 2, 65, 0

Orange 1

HEX: FFB316

RGB: 255, 179, 22

CMYK: 0, 33, 99, 0 

Orange 2

HEX: FC802D

RGB: 252, 128, 45

CMYK: 0, 62, 92, 0

Orange 3

HEX: FFCAAD

RGB: 255, 202, 173

CMYK: 0, 24, 29, 0

Clay

HEX: CC5605

RGB: 204, 86, 5

CMYK: 15, 78, 100, 4

Charcoal 1

HEX: 272727

RGB: 39, 39, 39

CMYK: 71, 65, 64, 69

Accessibility
Best Practices

Colors used on shapes, logos and text should always provide enough visual contrast for clear readability.

For reference, use this online contrast checker tool to make sure the colors you are using for text and graphics pass WCAG standards.

Text on photos

Using the same standard as above, make sure that text overlapped on photos have enough visual contrast for clear readability. Take into consideration viewers with low vision or color blindness.

 

If you are able, use the eyedropper tool in Photoshop or Illustrator to determine the HEX value of the photo and check it against WebAIM's online contrast checker.

Color transparency

Color block shapes can be overlapped on photos to create a unique layout. Make sure the shapes do not cover or obscure important details on your photo. The transparency mode you choose will depend entirely on the colors that show up in your photo.

 

Acceptable transparency modes (usually 50-100% opacity):

Multiply, Color Burn, Overlay, Soft Light, Hard Light, Regular 

Unacceptable transparency modes:
Difference, Exclusion, Saturation, Luminosity

 

Transparency may be used ONLY when overlapping a shape and a photo. Never overlap two transparent shapes, which will result in an off-brand color.

Color formats

Think about colors in two contexts: Onscreen and Print. The colors that you see on computer monitors or phones will always be illuminated and have a much wider color gamut then the inks in your average printer. This is why RGB and HEX values appear brighter and more saturated than CMYK. When you convert colors to CMYK for print, they will appear darker and sometimes dull because standard printers only have 4-6 colors to mix.

The most accurate method of color matching is called offset printing which uses specific spot colors (Pantone colors). 

Onscreen

RGB: Red, Green, Blue

HEX: Hexadecimal (used for websites)

Print

CMYK: Cyan, Magenta, Yellow, Black

PMS: Pantone Matching System

RGB

What you see on screen​

CMYK

How it will probably print​

EG_BrandGuide_back-to-top_btn-10.png

© 2020 Expedia Group