Conformance: Mandatory
Our brand colors help strengthen the connection and engagement residents have with the City. By consistently using official City colors, we are able to create a familiar and cohesive experience for residents as they interact with City services and programs.
Residents and employees should be able to recognize City colors in a variety of areas:
- Official logos
- Websites
- Digital platforms
- In-person signage
- Employee uniforms
- Social media graphics
- Print and promotional materials
Requirements
You must use the official colors in the City’s color palette and adhere to the color contrast chart that meet a color contrast ratio of 4.5:1 which are WCAG AA standards.
Benefits
- Consistent presentation of the City brand
- Increases credibility and trust
- Decreases cognitive load for residents as it provides immediate identification of City-branded materials
Risks
- People with low vision or visual impairments may not be able to read materials
- Residents will not be able to easily identify or recognize the City brand and organization
- Increases cognitive load for residents (e.g. residents have to relearn each time they see materials that use different
Color Code Uses
- HEX: digital (websites and coding)
- RGB: photography (screens using light)
- CMYK: print (using ink)
- PANTONE: print, etc. (color matching)
Color Palette
NOTE: CMYK and RGB colors have been designed differently to reflect a closer color match to Pantone color system.
Primary
Color |
Name |
HEX |
RGB |
CMYK |
PANTONE |
|
Corazón Red |
#8B0E04 |
139, 14, 4 |
0, 97, 100, 50 |
194 C |
|
Mission Bell Grey |
#333333 |
51, 51, 51 |
0, 0, 0, 92 |
BLACK7 C |
|
Pecan Brown |
#551900 |
85, 25, 0 |
0, 73, 100, 80 |
4975 C |
|
Mercado Rose |
#CF4240 |
207, 66, 64 |
13, 89, 79, 3 |
180 C |
|
Riverwalk Teal |
#038391 |
3, 131, 145 |
85, 33, 38, 4 |
7474 C |
Secondary
Color |
Name |
HEX |
RGB |
CMYK |
PANTONE |
|
Pearl White |
#EEEEEE |
238, 238, 238 |
0, 0, 0, 10 |
427 C |
|
Rio Blue |
#A1CBC9 |
161, 203, 201 |
37, 7, 21, 0 |
5503C |
|
Nopales Green |
#068460 |
6, 132, 96 |
86, 25, 76, 10 |
3288 C |
|
Fiesta Gold |
#F7D002 |
247, 208, 2 |
4, 15, 100, 0 |
108 C |
|
Concha Pink |
#E00490 |
224, 4, 144 |
7, 99, 0, 0 |
225 C |
Color Contrast Chart
All words should be a white or grey color for brand consistency. Alternatively, words need to be on a white or grey background. All other combinations do not meet the brand standard and/or cannot be legible because there is not enough color contrast.
Follow the chart to see which brand colors are acceptable with white text or background.
Color |
White Background
|
White Text
|
Corazón Red
#8B0E04 |
Sample Text |
Sample Text |
Mission Bell Grey
#333333 |
Sample Text |
Sample Text |
Pecan Brown
#551900 |
Sample Text |
Sample Text |
Mercado Rose
#CF4240 |
Sample Text |
Sample Text |
Riverwalk Teal
#038391 |
Sample Text |
Sample Text |
Concha Pink
#E00490 |
Sample Text |
Sample Text |
Nopales Green
#068460 |
Sample Text |
Sample Text |
Additionally, Mission Bell Grey is an acceptable text color and background. Follow the chart to see which brand colors are acceptable with grey text or background.
Color |
Grey Background
|
Grey Text
|
Fiesta Gold
#F7D002 |
Sample Text |
Sample Text |