• Text Resize A A A
  • Print Print
  • Share Share on facebook Share on twitter Share

Iconography

HHS.gov incorporates icons as an easy visual indicator for content areas within the site. Icons are paired with primary and secondary tiles throughout the site. For a more positive user experience, the icons have the same color and contrast as the navigation tile text they support. This can be seen in the multi-colored primary navigation tiles in the desktop browser view. The exception is when they are used as soft background graphics in the blue navigation tiles in the desktop browser view.


Icon Library

The complete Icon Library is shown in the table below. Overall, the icons are styled to be flat, one-color, and have subtle curves. The icon designs are simple and clear, even when scaled to a small size.

icon

accessible-1

icon

airplane-1

icon

alert-1

icon

apple-1

icon

bar-graph-1

icon

bar-graph-2

icon

bed-1

icon

blog-1

icon

bp-cuff-1

icon

briefcase-1

icon

building-1

icon

bulb-1

icon

bus-1

icon

business-1

icon

calendar-1

icon

car-1

icon

caregiver-1

icon

caregiver-2

icon

cart-1

icon

checklist-1

icon

clock-1

icon

comb-and-brush-1

icon

comment-1

icon

complain-1

icon

contact-1

icon

couple-1

icon

couple-2

icon

couple-3

icon

dna-1

icon

dollar-1

icon

education-1

icon

elder-1

icon

email-1

icon

energy-1

icon

environment-1

icon

expense-report-1

icon

eye-1

icon

eye-2

icon

family-1

icon

family-2

icon

family-3

icon

family-protection-1

icon

flask-1

icon

food-1

icon

gavel-1

icon

gender-1

icon

globe-1

icon

gov-delivery-1

icon

handicap-1

icon

health-privacy-1

icon

health-provider-1

icon

healthy-mind-1

icon

heart-rate-1

icon

heart-rate-2

icon

hhs-agencies-1

icon

house-1

icon

identity-1

icon

lock-1

icon

map-usa-1

icon

medical-1

icon

medical-assistance-1

icon

medical-health-1

icon

medical-protection-1

icon

microscope-1

icon

military-family-1

icon

news-1

icon

news-2

icon

news-3

icon

news-4

icon

news-5

icon

news-6

icon

news-7

icon

newsletter-1

icon

online-browser-1

icon

online-information-1

icon

open-door-1

icon

organization-chart-1

icon

parent-baby-1

icon

parent-child-1

icon

payment-card-1

icon

payment-card-2

icon

pencil-1

icon

pencil-paper-1

icon

people-1

icon

people-diverse-1

icon

person-1

icon

piggy-bank-1

icon

pills-1

icon

prescription-1

icon

process-cycle-1

icon

process-gears-1

icon

public-safety-1

icon

religion-1

icon

resources-1

icon

ribbon-1

icon

running-1

icon

scale-1

icon

search-1

icon

small-business-1

icon

smartphone-1

icon

stethoscope-1

icon

stopwatch-1

icon

support-1

icon

support-2

icon

syringe-1

icon

target-1

icon

thinking-1

icon

train-1

icon

travel-luggage-1

Usage

Examples of how icons are incorporated into HHS.gov are shown in Figure 11 and 12.

Figure 11, caption follows.
Figure 11: The multi-colored primary navigation tiles contain supporting icons for each navigation topic in the desktop browser view.

 

Figure 12, caption follows.
Figure 12: The light blue navigation tiles contain supporting icons in the background for each navigation topic in the desktop browser view.
Content created by Digital Communications Division (DCD)
Content last reviewed on July 7, 2016