Google Blue colour (#4285F4)

Google Blue is medium a blue with hex code #4285F4, the primary brand colour as commonly published in the brand’s guidelines. In RGB it is 66, 133, 244; in HSL 217°, 89%, 61%. Use the tool to explore shades and harmonies.

✓ Runs in your browser — nothing uploaded Free, no sign-upNo watermark

How to use the Google Blue colour

  1. The colour is pre-filled; click Explore to see all formats, shades and harmonies.
  2. Edit the value to try a variation.
  3. Copy the code you need.

Google Blue in every format

FormatValue
HEX#4285F4
RGBrgb(66, 133, 244)
RGB (0–1)0.259, 0.522, 0.957
HSLhsl(217, 89%, 61%)
CMYK (approx.)73%, 45%, 0%, 4%

Shades and tints of Google Blue

Same hue and saturation, lightness from 90% to 10%:

#cfe0fc #9fc1f9 #6ea3f7 #3e84f4 #0e65f1 #0b51c1 #083d91 #062860 #031430

Colours that go with Google Blue

HarmonyColours
Complementary #f4b043
Triadic #f44387 #87f443
Analogous #5843f4 #43dff4

Similar named colours

The closest CSS named colours by RGB distance, useful when you need a keyword instead of a hex code or want a near match:

ColourHEXDifference
royalblue #4169e1close
cornflowerblue #6495edclose
dodgerblue #1e90ffclose
steelblue #4682b4close
mediumslateblue #7b68eeclose

Accessibility

Contrast ratio of Google Blue against white is 3.56:1 (fails WCAG AA for normal text) and against black 5.89:1 (passes). Use black or very dark text on a Google Blue background rather than white.

Brand colours are the commonly published primary values and may be updated by the brand; check the official brand guidelines before print use. Trademarks belong to their owners.

Frequently asked questions

What is the hex code for Google Blue?

#4285F4.

What is Google Blue in RGB?

rgb(66, 133, 244).

What colour is complementary to Google Blue?

#f4b043, directly opposite on the colour wheel.

Privacy

This tool runs entirely inside your browser using WebAssembly and the Canvas/File APIs. Your files are never uploaded to ToolFlint or any third party; you can verify this in your browser's network tab or by switching to airplane mode after the page loads. Read how we process files.

Last updated 2026-09-23.