Adhering to the following color reproduction guidelines will help in creating a consistent image and maintaining the visual impact of the visual identity.

Whenever possible, the logo should appear in Carolina Blue. It may also be reproduced in black or white. When appearing on a white or light background, the entire logo should be either black or PMS® 542. When appearing on a dark or black background, the entire logo should reverse out to white.

A minimum of approximately 10% of Carolina Blue should appear in all materials produced for the University, including both print and web materials.

For All Print Applications:

For full color reproduction, please use either Pantone® 542 or the following breakdown for process color matching:

Carolina Blue
PMS® 542
CMYK 60, 19, 1, 4

For All Web Applications:

In 2017, the University adopted a new policy for web accessibility. Follow these color guidelines to ensure your website meets WCAG 2.0 AA accessibility standards*. For more information regarding accessibility, visit access.web.unc.edu.

Web Carolina Blue
Hex #4B9CD3
RGB 75, 156, 211

Link Blue
Hex #007FAE
RGB 0, 127, 174

Athletics Navy
Hex #13294B
RGB 19, 41, 75

Light Gray
Hex #E1E1E1
RGB 225, 225, 225

Dark Gray
Hex #767676
RGB 118, 118, 118

Black
Hex #151515
RGB 21, 21, 21

Web Color Usage:

Web Carolina Blue

Headers only against White

  • May not be used at smaller text sizes (below 14 pt/1.2 em)
  • Permitted at 14-pt bold or 18-pt non-bold and large

Examples:

Section Header
Section Header

Link Blue

Unvisited links

  • Required at smaller text sizes (below 18 pt/1.5 em) in place of Carolina Blue
  • Example hyperlink in a typical paragraph

Examples:

Example hyperlink in a typical paragraph

Athletics Navy

In combination with Carolina Blue

  • May also be used as header color or accent

Examples:

Section Header
Section Header
Section Header
Section Header

Light Gray

Backgrounds with Black or Athletics Navy text

  • May also be used as header color on Black or Athletics Navy

Examples:

Section Header
Section Header

Dark Gray

Body Text or Accent with White

  • May also be used as header color

Examples:

Section Header
Section Header
Example body copy in a typical paragraph.

Black

Any Text

  • Highest possible contrast
  • Always a good choice for body text

Examples:

Section Header
Section Header
Example body copy in a typical paragraph.

Restrictions regarding color and logos

  • Do not change any colors of the signature.
  • Do not screen any of the signature colors.
  • Do not print the signature in black over a dark background.
  • Do not print the reversed out signature onto a light or white background.
  • Do not place signature over heavily patterned background.
Examples of incorrect logo modifications and usageExamples of correct logo usage

*WCAG 2.0 AA standard information:

Success criteria for contrast ratios

4.5:1 for normal text

3:1 for large text (14+pt & bold, or 18+pt)*

Tools

WCAG Contrast Checker by Acart Communications  This one has an interactive picker when you click the mini palette next to your hex code that lets you dial in to the exact pixel that passes the contrast test.

Lea Verou’s Contrast Ratio Pretty interface to compare foreground and background colors.

WebAIM Color Contrast Checker Lighten and darken incrementing is a great feature.

Tota11y Toolkit Chrome Extension Reviews published pages and reports errors and warnings right on the spot.

Chrome Color Contrast Analyzer Extension from NCSU Grab sections of the page with text on images and this tool scans the pixels to demonstrate if enough contrast exists (eyeball test).

Note:

The point unit is indicated in the WCAG guidelines; however, points are rarely used in web development. This can create confusion! The point is larger than the more common pixel. However, the official warning below suggests that success in this area is a joint responsibility between authors and users.

The actual size of the character that a user sees is dependent both on the author-defined size and the user’s display or user-agent settings. For many mainstream body text fonts, 14 and 18 point is roughly equivalent to 1.2 and 1.5 em or to 120% or 150% of the default size for body text (assuming that the body font is 100%), but authors need to check this for the particular fonts in use. When fonts are defined in relative units, the actual point size is calculated by the user agent for display. The point size should be obtained from the user agent, or calculated based on font metrics as the user agent does, when evaluating this success criterion. Users who have low vision would be responsible for choosing appropriate settings.

Home
Back to Top