.jpg){kind=logo}
Graphics and Identity
The UF/IFAS Web Template
It is strongly recommended and preferred that UF/IFAS websites use the current UF/IFAS web template. The UF/IFAS template already meets web policy and accessibility standards and visually conveys affiliation with UF and IFAS. The template for UF/IFAS websites is available through the TERMINALFOUR (T4) Web Content Management System (WCMS) after gaining access. An overview of the UF/IFAS template can be found here. The template will dictate other parameters to promote consistency across our web presence. All UF/IFAS T4 templates are mobile-friendly. You can use 30 preloaded content pieces to build your website. Before customizing these preloaded content pieces be sure to review the AA accessibility standards information.
Header - Mandatory and persistent
UF/IFAS websites are required to include the following:
- Header Background color - Hex#0021a5.
- Name of the unit under the UF/IFAS logo. As an example, see The University of Florida's Department of Agricultural and Biological Engineering Unit page at https://abe.ufl.edu/. Units may substitute a unit name with a unit's graphic identity.
- UF/IFAS logo on the left. UF/IFAS branding clearly visible in the upper left-hand area of your web page. The UF/IFAS logo should link to http://ifas.ufl.edu. (Remember that the UF/IFAS logo always needs to be surrounded on all sides by clear space that is no less than one-half the height of the “UF” monogram.)
- Header requirements are different for UF/IFAS Extension websites and are located in the UF/IFAS Branding Guidelines - Web.
Footer - Mandatory and persistent
UF/IFAS websites are required to include the following:
- Footer Background color - Hex#0021a5.
- A way to contact persons responsible for web updates. This should be included in the footer.
- Date of last revision. This is required on the homepage but recommended for all pages.
- An active logo or text link to the UF homepage. Please add it to the footer.
- An active logo or text link to the UF/IFAS homepage.
- Other footer requirements are located in the UF/IFAS Branding Guidelines - Web. These pages include a list and explanation of required privacy and other policy links as well as placement of other graphic identity elements in the footer.
Coding and Identity
UF/IFAS Favicon
The UF/IFAS favicon is mandatory for all UF/IFAS websites and is available at https://tinyurl.com/ifasfavicon.
Other coding requirements are located in the UF/IFAS Branding Guidelines - Web. These pages include an explanation of the required meta code to improve the findability and searchability of all UF/IFAS websites.
Mandatory Colors and Use
As of July 2022, the current UF/IFAS Web Color list guide is below. Go here to review what we swapped, replaced, or retired.
Web Colors (Meet WCAG 2.0 AA guidelines)
| Color | RGB | HEX | WCAG Recommended Use |
|---|---|---|---|
| Blue (UF) |
0, 33, 165 | #0021A5 | Yes, on white or the reverse. IFAS header and footer color. |
| 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. |
| 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 | RGB | HEX | Recommended Use For |
|---|---|---|---|
| Purple | 106, 42, 96 | #6A2A60 | Yes, on white or the reverse. |
| Green (BRIGHT) |
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. |
| Blue (DARK) |
0, 38, 87 | #002657 | Yes, on white or the reverse. No, not for footers or headers. |
| 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. |
| White | 255, 255, 255 | #FFFFFF | Yes, on-page background color and other dark palette colors. |
| 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. |
| 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.
Colors On Graphics
It is recommended that communication pieces on the web only feature our orange and blue colors and use other colors as accents. All graphics must meet accessibility requirements.