Mandatory Colors and Use
Web Colors (Meet WCAG 2.0 AA guidelines)
Color Name OLD | RGB OLD | HEX OLD | Color Name NEW | RGB NEW | HEX NEW | WCAG Recommended Use |
Blue (UF) | 0,33,165 | #0021A5 | Yes, on white or the reverse. IFAS header and footer color. | |||
Blue (Web) | 0,82,155 | #00529B | 0,84,145 | #0021A5 | Yes, on white or the reverse. | |
Orange (Screen) | 250, 70, 22 | #FA4616 | No, do not use it unless the text is large. Acceptable on borders, or other graphical elements when on white or the reverse. | |||
Orange (UF) | 243,104,18 | #F36812 | Orange (Screen) | 250, 70, 22 | #FA4616 | No, do not use it unless the text is large. Acceptable on borders, or other graphical elements when on white or the reverse. |
Orange (Web) |
188, 88, 26 | #BC581A | Blue (UF) | 0,33,165 | #0021A5 | Yes, on white or the reverse. |
Grey (Body copy) | 51, 51, 51 | #333333 | Gray (Body copy) | 52, 55, 65 | #343741 | Yes, on white or the reverse. |
*Color Notes: Large text is defined as 14 point (typically 18.66px, or 1.2em) and bold or larger, or 18 point (typically 24px, or 1.5em) or larger.
COLORS TO PROMOTE UNIT INDIVIDUALIZATION
Web Colors (Meet WCAG 2.0 AA guidelines)
Color Name OLD | RGB OLD | HEX OLD | Color Name NEW | RGB NEW | HEX NEW | WCAG Recommended Use |
Blue (IFAS) | 52, 74, 150 | #344A96 | Blue (UF) | 0,33,165 | #0021A5 | Yes, on white or the reverse. |
Brown | 83, 62, 11 | #533E0B | REMOVED | When you update the content piece the user will be asked to replace the color. | ||
Purple (BRIGHT) | 87, 57, 114 | #573972 | Purple | 106, 42, 96 | #6A2A60 | Yes, on white or the reverse. |
Green (BRIGHT) | 94, 142, 63 | #5E8E3F | Green | 34, 136, 76 | #22884C | No, do not use it unless the text is *large. Acceptable on borders, or other graphical on white or the reverse. |
Red (Bottlebrush) | 211, 39, 55 | #D32737 | Yes, on white or the reverse. | |||
Blue (Dark) | 0, 38, 87 | #002657 | Yes, on white or the reverse. No, not for footers or headers. | |||
Blue (MUTED) | 107, 153, 194 | #6B99C2 | Blue (UF) | 0,33,165 | #0021A5 | Yes, on white or the reverse. |
Yellow (Alachua) | 242, 169, 0 | #CD8C00 | No, do not use unless the text is *large and on Gray (#343741) or its reverse. Use on borders, or other graphical elements when on white or the reverse. | |||
Orange (MUTED) | 222, 123, 30 | #DE7B1E | Orange (Sreen) | 250, 70, 22 | #FA4616 | No, do not use it unless the text is large. Acceptable on borders, or other graphical elements when on white or the reverse. |
White | 255, 255, 255 | #FFFFFF | Yes, on page background color and other dark palette colors. | |||
Purple | 223, 226, 243 | #DFE2F3 | Warm Gray 1 | 216, 212, 215 | #D8D4D7 | Yes, on Gray (#343741) or the reverse or other dark palette colors. For table rows/cells/site title and page backgrounds. |
Light Grey | 245, 245, 245 | #F5F5F5 | Yes, on Gray (#343741) or the reverse or other dark palette colors. For table rows/cells/site title and page backgrounds, horizontal lines. | |||
Gray | 199, 201, 200 | #C7C9C8 | Yes, on Gray (#343741) or the reverse or other dark palette colors. For table rows/cells/site title and page backgrounds. |
Other Colors
Some UF/IFAS initiatives have preexisting style guides. Generally, the UF/IFAS color guide should supersede preexisting style guides. Preexisting style guides should select the closest colors in the above UF/IFAS color palettes. For questions about integrating your style guide with UF/IFAS colors, contact webteam@ifas.ufl.edu.