Components

The Components showcase the reusable building blocks of Advocate Health's design system, designed to streamline development and ensure consistency.
Explore a comprehensive library of components—from alerts and banners to forms and navigation—designed to create seamless and user-friendly experiences.


Naming Convention & Categories

Components in Advocate Health’s Design System are organized into clear categories to ensure consistency and ease of use. Each category is assigned a letter for quick reference:

  • A – Alerts
  • B – Banners
  • C – Content Components
  • I – Integrations
  • F – Forms
  • N – Navigation
  • S – Search

This structured approach streamlines development and helps teams quickly find the components they need.


Component Index

Easily find and access all components in the Advocate Health Design System. Browse the full list below, organized by category, and click on any component to learn more.

A - Alerts

A1 Alerts
A2 Pinned alert card

 
B - Banners

B1 HERO banner
B2 HERO banner carousel
B3 HERO features banner
 
 

 

 
C - Content Components

 
I - Integrations

I01 Sparkle Provider or Location Search
I02 Sparkle Event Search
I03 Sparkle Provider Profile
I04 Sparkle Location Overview
I05 Sparkle Event Details
I06 Sparkle Appointment
I07 Sparkle Appointment Confirmation
I08 Sparkle Event Confirmation
 

 
F - Forms

F1 Forms
 
 

 
N - Navigation

N1 Main Global Navigation
N2 Utility Navigation
N3 Left-Side Navigation
N4 Left-Side Navigation Anchor Link
N5 Breadcrumb
N6 Main Footer
N7 Corporate Footer
N8 Tabs
 

 
S - Search

S1 Find a Doctor
S2 Find a Location
S3 Filter by Type
S4 Search Results
S5 Embedded Search
S6 Embedded Search with Results
S7 Service Search
S8 Blog Listing
S9 News Listing