E-commerce & Payments
Google Pay Color Codes
Google Pay uses Google's four brand colors, blue #4285F4, red #EA4335, yellow #FBBC04 and green #34A853, on the G, with Pay set in grey. The Google Pay color codes in Hex, RGB and CMYK can be found below. The service has been through several names, from Google Wallet in 2011 to Android Pay in 2015, before settling as Google Pay in 2018. Its direct rival is Apple Pay.
Primary colors
What are Google Pay Primary Colors?
Google Pay's primary colors are google blue #4285F4, google red #EA4335, google yellow #FBBC04, google green #34A853.
Google publishes these values in its brand guidelines; the CMYK shown is a conversion.
Google Pay Google Blue
| Hex | #4285F4 |
|---|---|
| RGB | 66, 133, 244 |
| HSL | hsl(217, 89%, 61%) |
| CMYK | 73%, 45%, 0%, 4%converted · approximate |
| Pantone | PMS 2718 Cnearest match · not published by the brand |
Google Pay Google Red
| Hex | #EA4335 |
|---|---|
| RGB | 234, 67, 53 |
| HSL | hsl(5, 81%, 56%) |
| CMYK | 0%, 71%, 77%, 8%converted · approximate |
| Pantone | PMS 179 Cnearest match · not published by the brand |
Google Pay Google Yellow
| Hex | #FBBC04 |
|---|---|
| RGB | 251, 188, 4 |
| HSL | hsl(45, 97%, 50%) |
| CMYK | 0%, 25%, 98%, 2%converted · approximate |
| Pantone | PMS 123 Cnearest match · not published by the brand |
Google Pay Google Green
| Hex | #34A853 |
|---|---|
| RGB | 52, 168, 83 |
| HSL | hsl(136, 53%, 43%) |
| CMYK | 69%, 0%, 51%, 34%converted · approximate |
| Pantone | PMS 355 Cnearest match · not published by the brand |
Google Pay Hex Color Codes
Google Pay hex color codes are #4285F4 for google blue, #EA4335 for google red, #FBBC04 for google yellow and #34A853 for google green.
| Color | Hex |
|---|---|
| Google Blue | #4285F4 |
| Google Red | #EA4335 |
| Google Yellow | #FBBC04 |
| Google Green | #34A853 |
Google Pay RGB Color Codes
Google Pay RGB color codes are 66, 133, 244 for google blue, 234, 67, 53 for google red, 251, 188, 4 for google yellow and 52, 168, 83 for google green. Reach for RGB when a tool wants channel numbers or a CSS alpha value.
| Color | RGB |
|---|---|
| Google Blue | rgb(66, 133, 244) |
| Google Red | rgb(234, 67, 53) |
| Google Yellow | rgb(251, 188, 4) |
| Google Green | rgb(52, 168, 83) |
Google Pay HSL Color Codes
Google Pay HSL color codes are 217, 89%, 61% for google blue, 5, 81%, 56% for google red, 45, 97%, 50% for google yellow and 136, 53%, 43% for google green. Change the third value for a lighter or darker version without moving the hue.
| Color | HSL |
|---|---|
| Google Blue | hsl(217, 89%, 61%) |
| Google Red | hsl(5, 81%, 56%) |
| Google Yellow | hsl(45, 97%, 50%) |
| Google Green | hsl(136, 53%, 43%) |
Google Pay CMYK Color Code
Google Pay CMYK color codes are conversions from the hex, because the brand publishes none. Check a printed proof before a full run.
| Color | CMYK |
|---|---|
| Google Blue | 73%, 45%, 0%, 4% |
| Google Red | 0%, 71%, 77%, 8% |
| Google Yellow | 0%, 25%, 98%, 2% |
| Google Green | 69%, 0%, 51%, 34% |
Google Pay Pantone Color Codes
Google Pay Pantone color codes are nearest matches by color distance, not brand specs. The table shows the closest swatch for every color.
| Color | Nearest Pantone |
|---|---|
| Google Blue | PMS 2718 C |
| Google Red | PMS 179 C |
| Google Yellow | PMS 123 C |
| Google Green | PMS 355 C |
Logo
Google Pay Logo Colors
Google Pay logo colors are the four Google hues on the G, with a grey Pay wordmark.
Google Pay Logo Colors Palette
What the Google Pay Logo Colors Mean?
The Google Pay logo colors are inherited rather than chosen for the product. The multicolor G is Google's corporate mark, and putting it in front of a plain grey Pay ties the payment service to the parent without inventing a separate identity. The four colors themselves date back to Google's first logo and its mix of primary and secondary hues.
Google Pay Logo Color History
Google Pay logo color history follows the name changes. Android Pay used a single Android green; the 2018 switch to Google Pay brought in the four-color G, and a 2020 redesign kept the G while redrawing the wordmark.
Google Pay Logo Fonts
Google Pay logo fonts are Product Sans, the geometric sans Google uses for its own logos, kept in-house. Google Sans covers the rest of the brand and is also unavailable to license.
Google Pay Logo JPG
Google Pay logo in JPG. No transparency, so it is flattened onto white. Safe for documents and slide decks.
Google Pay Logo PNG
Google Pay logo in PNG, with a transparent background. Use it over a colored surface.
Google Pay Logo WebP
Google Pay logo in WebP. Same transparency as the PNG at about a third of the file size.
Google Pay Color Code Shades
Google Pay color code shades step evenly from the primary toward black, for hover states, borders and shadows.
These are interface steps, not Google Pay paint or trim names.
In code
Using the Google Pay palette
CSS custom properties
:root {
--google-pay-google-blue: #4285F4;
--google-pay-google-red: #EA4335;
--google-pay-google-yellow: #FBBC04;
--google-pay-google-green: #34A853;
}Contrast against white
| Google Blue | 3.56:1AA × |
|---|---|
| Google Red | 3.92:1AA × |
| Google Yellow | 1.71:1AA × |
| Google Green | 3.06:1AA × |
Brand colors are chosen for recognition, not for legibility. A failing value here is normal. It means use it as a fill, not as text.