colors
Color Examples
Description
These are the offically supported colors for web properties of UCSF. Note they are used in "primary" and "secondary" main colors on many of the sites, although the other colors have been designed for complimentary look and feel. Future goals are to build out the suggested color combinations that ensure best practices for design and accessiblity. E.g, a light font used on a dark background.
Usage
Colors are the digital or interactive versions of the UCSF Brand master palette, and provide opportunities for greater contrast in order to meet W3C’s Web Content Accessibility Guideline (WCAG) AA level color contrast standards. Font size and other key details still need to be considered when using colored backgrounds. Visit identity.ucsf.edu for precise use cases and applications.
Primary Colors
- #052049
- #058488
- #6EA400
- #0071AD
- #F26D04
Secondary Colors
- #716FB2
- #EB093C
- #FFDD00
Neutral Colors
- #FFF
- #EFEFEF
- #DDD
- #D1D3D3
- #B4B9BF
- #939393
- #666
- #525860
- #000
Tints
Navy
- #052049
- #506380
- #9BA6B6
- #E6E9ED
Blue
- #0071AD
- #007CBE
- #5DAFDB
- #A2D1EA
- #E8F4FA
Orange
- #F26D04
- #F7A665
- #FBCCA7
- #FEF2E9
Teal
- #058488
- #5DBFC5
- #A3DADE
- #E8F6F7
Green
- #6EA400
- #B1D16F
- #D3E4AD
- #F4F8EA
Purple
- #716FB2
- #9C9AC9
- #C6C5E0
- #F1F1F7
Pink
- #EB093C
- #F25D7F
- #F7A3B6
- #FDE8ED
Yellow
- #FFDD00
- #FFE74D
- #FFF199
- #FFFCE6