UNC Research Colors
Color Palette
A minimum of approximately 10 percent Carolina Blue should appear in all print and web materials produced for the University.
UNC Research also has an extended color palette, perfect if more colors are needed and also to differentiate the unit from other sections of campus. The palette is bright and eye catching, but was also created to flow nicely with the University’s official color palette.
University Colors
The University brand uses both a primary and secondary color palette for print and digital content. There are special alternative versions of Carolina Blue for digital content only. Carolina Blue is the main color of the University and must be used at least 10% on all designs. UNC Research has a secondary color palette that can be found below.
Carolina Blue
PMS 542
CMYK 60, 19, 1, 4
Hex #7BAFD4
RGB 75, 156, 211
Digital Links #007FAE
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 Alternative Carolina Blue
Carolina Blue is a light color and extra considerations need to be made for people who are low vision or colorblind. When used as noted below, the web alternative colors meet accessibility requirements and make our websites more inclusive.
The suggested font sizes below are based on Web Carolina Blue over a white background. Hyperlink Blue should only be used on a white background. Use the WebAIM Color Contrast Checker to test the color contrast of your chosen color combinations. For more information on the usage of University colors and accessibility, please see the guidelines and resources on the official UNC branding Websites page.
Web Carolina Blue
Hex #4B9CD3
RGB 75, 156, 211
NOTE: Use with font sizes larger than 24 px (or 19 px and bold).
UNC Research Secondary Colors
Teal
Web #6AC9D2
RGB 106, 201, 210
Meadow Green
Web #C7DA7D
RGB 199, 218, 125
Yellow
Web #FDDD3F
RGB 253, 221, 63
Orange
Web #F29137
RGB 242, 145, 55
Fuschia
Web #D61B7A
RGB 214, 27, 122
*WCAG 2.0 AA STANDARDS:
Success criteria for contrast ratios
4.5:1 for normal text
3:1 for large text (14+pt & bold, or 18+pt)*
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.