How do I find my brand colors' hex codes?

A hex code is a six-character code, after a # sign, that names an exact color on screens. For example, #FFFFFF is white and #000000 is black. Websites use hex codes, so knowing yours keeps your brand color the same everywhere.

Where to look first

1. Your brand kit or style guide, if you have one.
2. The designer who made your logo. Ask for the color codes; designers usually list them.
3. Your logo's vector file. Opened in a design app, it shows the exact colors.
4. Your printer. If they printed your cards or signs, they may have the print colors (CMYK or Pantone), which a designer can match to hex.

Reading a color from your screen

Official guide (Mac): https://support.apple.com/guide/digital-color-meter/welcome/mac

1. Open your logo on screen at a large size.
2. On a Mac, open Digital Color Meter from the Utilities folder in Applications.
3. Move the pointer over a solid part of the logo color.
4. Choose Color, then Copy Color as Text to copy the value.
5. Send us the value along with a screenshot of where you measured it.

On Windows, many photo and design apps include an eyedropper tool that shows hex codes. Colors measured from a screen or a JPG can be slightly off, so a code from the original design file is always better.

Check it is readable

Once you know your colors, check text against its background. Web accessibility guidelines call for a contrast ratio of at least 4.5 to 1 for normal text and 3 to 1 for large text.

We can do this for you. Open a request in your client portal and our team will pull your brand colors from your logo and website.

Common problems

• If you get several close shades from the same logo, measure a flat area away from edges and shadows, or ask your designer for the exact code.
• If your colors look different on two screens, that is normal; screens vary. Trust the code, not the screen.
• If your brand color is too light for text, use it for accents and use a darker shade for words.

Related articles

• What is a brand kit or style guide?
• Which logo files should I have, and which do I send you?