Technology
Google Color Codes
Google's colors are blue #4285F4, red #EA4335, yellow #FBBC05 and green #34A853, in that order across the six letters. The Google color codes in Hex, RGB and CMYK can be found below. Ruth Kedar designed the logo in May 1999. The green on the L is the part that matters, and it is there on purpose.
Primary colors
What are Google Primary Colors?
Google's primary colors are blue #4285F4, green #34A853, yellow #FBBC05 and red #EA4335.
Google publishes these values through its brand resource center, so the hex codes here are published rather than sampled.
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 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 Yellow
| Hex | #FBBC05 |
|---|---|
| RGB | 251, 188, 5 |
| HSL | hsl(45, 97%, 50%) |
| CMYK | 0%, 25%, 98%, 2%converted · approximate |
| Pantone | PMS 123 Cnearest match · not published by the brand |
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 Hex Color Codes
Google hex color codes are #4285F4 for blue, #34A853 for green, #FBBC05 for yellow and #EA4335 for red.
| Color | Hex |
|---|---|
| Blue | #4285F4 |
| Green | #34A853 |
| Yellow | #FBBC05 |
| Red | #EA4335 |
Google RGB Color Codes
Google RGB color codes are 66, 133, 244 for blue, 52, 168, 83 for green, 251, 188, 5 for yellow and 234, 67, 53 for red. Reach for RGB when a tool wants channel numbers or a CSS alpha value.
| Color | RGB |
|---|---|
| Blue | rgb(66, 133, 244) |
| Green | rgb(52, 168, 83) |
| Yellow | rgb(251, 188, 5) |
| Red | rgb(234, 67, 53) |
Google HSL Color Codes
Google HSL color codes are 217, 89%, 61% for blue, 136, 53%, 43% for green, 45, 97%, 50% for yellow and 5, 81%, 56% for red. Change the third value for a lighter or darker version without moving the hue.
| Color | HSL |
|---|---|
| Blue | hsl(217, 89%, 61%) |
| Green | hsl(136, 53%, 43%) |
| Yellow | hsl(45, 97%, 50%) |
| Red | hsl(5, 81%, 56%) |
Google CMYK Color Code
Google CMYK color codes are conversions from the hex, because the brand publishes none. Check a printed proof before a full run.
| Color | CMYK |
|---|---|
| Blue | 73%, 45%, 0%, 4% |
| Green | 69%, 0%, 51%, 34% |
| Yellow | 0%, 25%, 98%, 2% |
| Red | 0%, 71%, 77%, 8% |
Google Pantone Color Codes
Google Pantone color codes are nearest matches by color distance, not brand specs. The table shows the closest swatch for every color.
| Color | Nearest Pantone |
|---|---|
| Blue | PMS 2718 C |
| Green | PMS 355 C |
| Yellow | PMS 123 C |
| Red | PMS 179 C |
Logo
Google Logo Colors
Google logo colors are three primaries plus one secondary, and the odd one out is deliberate.
Google Logo Colors Palette
What the Google Logo Colors Mean?
The Google logo colors break their own pattern. Kedar has explained it directly: the palette is the primary colors, but instead of running them in order she put a secondary color on the L, which brought back the idea that Google doesn't follow the rules. That single green letter is the whole argument of the mark. Every other four-color tech logo in this category, including Microsoft, keeps its sequence tidy.
Google Logo Color History
Google logo color history splits at 1 September 2015. The 1999 wordmark was set in Catull, an old-style serif drawn by Gustav Jaeger for Berthold in 1982, and Kedar picked it for the shape of its stems. The 2015 redesign replaced it with Product Sans and lifted the four colors slightly brighter, but left the green L exactly where it was.
Google Logo Fonts
Google logo fonts are Product Sans, a geometric sans-serif drawn in-house and used since 1 September 2015. Before that the wordmark ran in Catull, a 1982 Berthold serif by Gustav Jaeger. Neither is licensable to the public.
Google Logo JPG
Google logo in JPG. No transparency, so it is flattened onto white. Safe for documents and slide decks.
Google Logo PNG
Google logo in PNG, with a transparent background. Use it over a colored surface.
Google Logo WebP
Google logo in WebP. Same transparency as the PNG at about a third of the file size.
Google Color Code Shades
Google color code shades step evenly from the primary toward black, for hover states, borders and shadows.
These are interface steps, not Google paint or trim names.
In code
Using the Google palette
CSS custom properties
:root {
--google-blue: #4285F4;
--google-green: #34A853;
--google-yellow: #FBBC05;
--google-red: #EA4335;
}
Contrast against white
| Blue | 3.56:1AA × |
|---|---|
| Green | 3.06:1AA × |
| Yellow | 1.71:1AA × |
| Red | 3.92: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.