Google colors
The Google color palette has 4 colors: Google Blue #4285F4, Google Red #EA4335, Google Yellow #FBBC05 and Google Green #34A853. Below are HEX, RGB, HSL and OKLCH codes, contrast checks, CSS and Tailwind variables, all from its live website code checked on 16 October 2026.
Google color codes
| Color | Role | HEX | RGB | HSL | OKLCH |
|---|---|---|---|---|---|
| Google Blue | Primary | #4285F4 | rgb(66, 133, 244) | hsl(217, 89%, 61%) | oklch(63% 0.18 260) |
| Google Red | Secondary | #EA4335 | rgb(234, 67, 53) | hsl(5, 81%, 56%) | oklch(62.6% 0.206 29.1) |
| Google Yellow | Secondary | #FBBC05 | rgb(251, 188, 5) | hsl(45, 97%, 50%) | oklch(83% 0.17 84) |
| Google Green | Secondary | #34A853 | rgb(52, 168, 83) | hsl(136, 53%, 43%) | oklch(64.8% 0.16 148.5) |
Select a color to open its own page with tints, shades, harmonies and every color format, or open the whole set in the palette generator.
Where the Google colors come from
Google does not publish hex values in public brand guidelines, so these were read from the code of its live website (stylesheets and the SVG files it serves) on 16 October 2026. They are the colors www.google.com actually renders, which can differ slightly from print or logo colors.
- Source (live website CSS or SVG): https://partnermarketinghub.withgoogle.com/brands/google/overview/ checked 2026-10-16
Google color contrast
Black text on Google Blue has a contrast ratio of 5.89:1 and passes WCAG AA for body text. Used as a text color, Google Blue reaches 3.56:1 on white and 5.89:1 on black. Ratios are WCAG 2 (truncated, never rounded up); APCA Lc is shown as a second opinion.
| Pair | WCAG 2 ratio | WCAG 2 result | APCA | APCA guidance |
|---|---|---|---|---|
| White on Google Blue | 3.56:1 | AA large text | Lc -68.3 | Content text, not long reading |
| Black on Google Blue | 5.89:1 | AA | Lc 41.3 | Non-text elements, placeholder text |
| White on Google Red | 3.92:1 | AA large text | Lc -70.8 | Content text, not long reading |
| Black on Google Red | 5.35:1 | AA | Lc 38.8 | Non-text elements, placeholder text |
| White on Google Yellow | 1.70:1 | Fails | Lc -34.1 | Non-text elements, placeholder text |
| Black on Google Yellow | 12.29:1 | AAA | Lc 73.5 | Content text, not long reading |
| White on Google Green | 3.05:1 | AA large text | Lc -62.4 | Content text, not long reading |
| Black on Google Green | 6.87:1 | AA | Lc 47.1 | Large or bold text, headings |
| Pair | WCAG 2 ratio | WCAG 2 result | APCA | APCA guidance |
|---|---|---|---|---|
| Google Red on Google Yellow | 2.29:1 | Fails | Lc 32.8 | Non-text elements, placeholder text |
| Google Blue on Google Yellow | 2.08:1 | Fails | Lc 30.3 | Non-text elements, placeholder text |
| Google Green on Google Yellow | 1.78:1 | Fails | Lc 24.5 | Dividers and decoration only |
| Google Red on Google Green | 1.28:1 | Fails | Lc 0.0 | Not readable |
Google colors in CSS and Tailwind
Copy the Google palette as CSS custom properties or as a Tailwind CSS v4 theme. The last snippet is an 11-step Tailwind scale (50 to 950) generated in OKLCH from Google Blue, for hover states, borders and tinted backgrounds.
:root {
--google-blue: #4285F4;
--google-red: #EA4335;
--google-yellow: #FBBC05;
--google-green: #34A853;
}@import "tailwindcss";
@theme {
--color-google-blue: #4285F4;
--color-google-red: #EA4335;
--color-google-yellow: #FBBC05;
--color-google-green: #34A853;
}@theme {
--color-google-50: #F1F6FE;
--color-google-100: #E0EBFB;
--color-google-200: #C7DAFA;
--color-google-300: #9FC2FA;
--color-google-400: #6BA0F8;
--color-google-500: #4285F4;
--color-google-600: #216CE3;
--color-google-700: #1459C5;
--color-google-800: #14499F;
--color-google-900: #173E7F;
--color-google-950: #0F254A;
}Named colors closest to the Google palette
The nearest named color to each brand color, measured as perceptual distance (ΔE OK) in OKLab. Under 0.02 is hard to tell apart; above 0.05 the difference is easy to see.
| Brand color | HEX | Nearest named color | Named HEX | ΔE OK |
|---|---|---|---|---|
| Google Blue | #4285F4 | Dodger Blue | #1E90FF | 0.032 |
| Google Red | #EA4335 | Vermillion | #F4320C | 0.028 |
| Google Yellow | #FBBC05 | Golden Rod | #F9BC08 | 0.003 |
| Google Green | #34A853 | Mid Green | #50A747 | 0.019 |
Palettes like Google
Curated palettes that include a color close to Google Blue #4285F4.
How to use a Google-style palette
- Lead with Google Blue #4285F4 for buttons, links and key highlights, with black text on it.
- Google lists no neutrals, so pair Google Blue with white or a near-black for about 60% of the layout and let Google Blue take about 30%.
- Keep Google Red, Google Yellow and Google Green for small accents (around 10%): status colors, illustrations or charts.
- As text on a white page, Google Blue reaches 3.56:1: it passes WCAG AA only for large or bold text (18pt, or 14pt bold).
To see how www.google.com uses these colors today, including backgrounds, text and dark mode, run it through the website color extractor. To turn Google Blue into a full light and dark color system with accessible roles, open it in the Color System Studio.
More brand colors
- Apple colors#0071E3 #0066CC #1D1D1F #F5F5F7
- T-Mobile colors#E20074 #A7005A #770141 #000000
- Microsoft colors#F25022 #7FBA00 #00A4EF #FFB900
- Figma colors#FF3737 #FF7237 #874FFF #00B6FF
- Shopify colors#95BF47 #5E8E3E #008060 #18181B
- Trello colors#0052CC #2684FF #253858
- Duolingo colors#58CC02 #1CB0F6 #FF4B4B #FFC800
- Dropbox colors#0061FE #1E1919 #F7F5F2 #14C8EB
- GitHub colors#0FBF3E #101411 #F2F5F3 #909692
- Slack colors#4A154B #E01E5A #36C5F0 #2EB67D
- Notion colors#000000 #0075DE #191918 #FFB110
- Linear colors#5E6AD2 #7170FF #F4F5F8 #222326
Trademarks
Frequently asked questions
What is the Google hex color?
The main Google color is Google Blue #4285F4, which is rgb(66, 133, 244) in RGB. It comes from the CSS and SVG files of Google's live website (Google publishes no official hex values), checked on 16 October 2026.
What colors does Google use?
Google uses 4 core colors: Google Blue #4285F4, Google Red #EA4335, Google Yellow #FBBC05 and Google Green #34A853.
What is Google Blue in RGB, HSL and OKLCH?
Google Blue #4285F4 is rgb(66, 133, 244), hsl(217, 89%, 61%) and oklch(63% 0.18 260). The closest named color is Dodger Blue #1E90FF.
Should text on Google Blue be white or black?
Black text reads better on Google Blue: it has a contrast ratio of 5.89:1, which passes WCAG AA for body text.
Where do these Google colors come from?
The hex values were read from Google's live website code at https://partnermarketinghub.withgoogle.com/brands/google/overview/ on 16 October 2026. Contrast, RGB, HSL and OKLCH values on this page are calculated from those hex codes.
Can I use the Google colors in my own design?
Colors on their own are not owned, but Google's name, logo and the way it combines its colors are trademarks. Use these values to match Google when you refer to it, follow its official guidelines, and do not imply a link to Google in your own brand.
Use the Google colors
Check www.google.com live, build a color system from Google Blue, or remix the palette.