Google Color Palette

Select any value to copy it.

• Google Blue

  Primary

  #4285F4rgb(66, 133, 244)hsl(217, 89%, 61%)

  Closest in ArchiveCobalt Tone Vivid
  Closest in Archive: Cobalt Tone Vivid

• Google Red

  Primary

  #EA4335rgb(234, 67, 53)hsl(5, 81%, 56%)

  Closest in ArchiveScarlet Radiant Vivid
  Closest in Archive: Scarlet Radiant Vivid

• Google Yellow

  Primary

  #FBBC04rgb(251, 188, 4)hsl(45, 97%, 50%)

  Named Google Yellow (core, 500) in Google Fiber's brand guidelines and used in google.com's stylesheet; the Google logo image itself uses #FBBC05.

  Closest in ArchiveSaffron Radiant Pure
  Closest in Archive: Saffron Radiant Pure

• Google Green

  Primary

  #34A853rgb(52, 168, 83)hsl(136, 53%, 43%)

  Closest in ArchiveSeafoam Velvet Clear
  Closest in Archive: Seafoam Velvet Clear

• Logo Yellow

  Accent

  #FBBC05rgb(251, 188, 5)hsl(45, 97%, 50%)

  The yellow in the Google logo image served from google.com.

  Closest in ArchiveSaffron Radiant Pure
  Closest in Archive: Saffron Radiant Pure

Can it carry text? (WCAG contrast)

Each color as text on white and on black. AA means body text passes. Select a ratio to open the pair in the contrast checker.

• Google BlueAaon white3.56:1Large text onlyGoogle Blue: Open in contrast checkerAaon black5.89:1AAGoogle Blue: Open in contrast checker
• Google RedAaon white3.92:1Large text onlyGoogle Red: Open in contrast checkerAaon black5.35:1AAGoogle Red: Open in contrast checker
• Google YellowAaon white1.71:1Not for textGoogle Yellow: Open in contrast checkerAaon black12.30:1AAGoogle Yellow: Open in contrast checker
• Google GreenAaon white3.06:1Large text onlyGoogle Green: Open in contrast checkerAaon black6.87:1AAGoogle Green: Open in contrast checker
• Logo YellowAaon white1.71:1Not for textLogo Yellow: Open in contrast checkerAaon black12.30:1AALogo Yellow: Open in contrast checker

About this palette

The Google logo uses blue, red and yellow, the three primaries, plus a green. Ruth Kedar, who designed the young startup's logo, has said keeping primary colors was an obvious choice because they are used in early-childhood toys such as building blocks, and that mixing up their order signaled a company that did not follow established rules. Google's 2015 redesign kept the four-color sequence but pushed the vibrancy of the red, green and yellow so they would not dull where they touch, as in the G icon. Google Fiber's brand guidelines, which use Google's palette, extend each color into a tonal scale from 50 to 900.

Copy as code

Every token name carries the brand, so two brands can share one stylesheet.

:root {
  --google-blue: #4285f4;
  --google-red: #ea4335;
  --google-yellow: #fbbc04;
  --google-green: #34a853;
  --google-logo-yellow: #fbbc05;
}

@theme {
  --color-google-blue: #4285f4;
  --color-google-red: #ea4335;
  --color-google-yellow: #fbbc04;
  --color-google-green: #34a853;
  --color-google-logo-yellow: #fbbc05;
}

module.exports = {
  theme: {
    extend: {
      colors: {
        "google-blue": "#4285f4",
        "google-red": "#ea4335",
        "google-yellow": "#fbbc04",
        "google-green": "#34a853",
        "google-logo-yellow": "#fbbc05",
      },
    },
  },
};

Source: https://fiber-brand.appspot.com/color · As of 2026-10-07 · This page is an unofficial reference. Color values are factual sRGB hex codes and not subject to copyright; the Google name and any associated marks belong to their owner. Request removal via support.

More from Tech & Hardware