NNPHI Pattern Library
Color Palette
primary
navy
purple
lightBlue
secondary
orange
yellow
peach
brightPurple
blue
tints
purpleTint
blueTint
lightGrayTint
grayTint
gray
gray
grayDark
grayDarker
grayDarkest
black/white
black
white
error
error
Search
documentation
Project
Color Palette
Type Styles
Patterns
Bits
Icons
Bullhorn
Calendar
Chat Icon
Chevron Down
Clear X
Document Icon
Download
Email Icon
External Link
Facebook
Internal Link
Left Chevron
Linkedin
Location Icon
Menu
Person Icon
Phone Icon
Quote Icon
Right Chevron
Default
Thin
Search
Update Boxes
X
Youtube
Linked Text With Icon
Default
Internal Link
File Link
Link List Variant
Type Style Headline 5
Type Style Bodylarge
Logos
Nnphi Logo Horizontal
Nnphi Stacked Logo
Quick Search
Default
On Dark
Social Links
Standard Button
Default
External Link
Download Link
Disabled Button
Secondary Button
Secondary Button Dark
Disabled Secondary Button
On Dark Button
Disabled On Dark Button
On Dark Secondary Button
Disabled On Dark Secondary Button
On Dark Secondary Homepage Button
Disabled On Dark Secondary Homepage Button
Blue Button
Disabled Blue Button
In Sidebar
Tag Badge
Default
Large
Tag Badge List
Default
Large
White Tags
Blue Tint Tags
Components
Accordion
Default
Single Item
Blue Tint Background
Blog Cards
Default
Blue Tint Background
Blue Background
Call To Action
Default
Long Lead In Text
With External Link
Short Button Text
Full Width
Navy
On Homepage
Carousel
Event Cards
Default
Blue Tint Background
Blue Background
Form
Image
Default
Image With Caption
Link Cards
Default
Blue Tint Background
Link List
Default
Blue Tint Background
Map Section
Default
Long Cta Text
Homepage
Numbers
Default
No Calls To Action
Homepage
Profile Cards
Default
Blue Tint Background
Quote
Default
Blue Tint Background
Resource Cards
Default
Blue Tint Background
One Resource
Text
Default
No Header
With Half Width Image On Right
With Half Width Image On Left
With Third Width Image On Right
With Third Width Image On Left
Topic Block
Default
Without Call To Action
Reversed
Homepage
Homepage Reversed
Video
Default
Video With Caption
Pages
Basic Page
Default
With Intro Text
With Intro Text And Image
Blog Post
Default
No Related Phis
Five Authors
Error
Error 500
Event Listing
Event Post
Generic Page
Homepage
Member Post
Posts
Profile Post
Resource Post
Search
Search Page
Taxonomy Listing
Default
Blog
Profile
Member
No Results
Partials
Basic Header
Default
Landing Page
Featured Image
Blog Card
Default
Blue Background
Long Title
Blog Card Large
Default
No Tags
Blue Tint Background
Blog Header
Event Card
Event Header
Filters
Footer
Header
Homepage
Homepage Hero
Default
Short Heading
Homepage Map
Map Section Map
Homepage Programs Section
Default
With 6 Cards
No Call To Action
Homepage Resources Section
Homepage Topics Section
Homepage Who Section
Image
Default
Image With Caption
Listing Header
Default
With Intro Text
No Sidebar Navigation
Member Card
Default
One Tag
Multiple Regions
Member Header
Metadata Eyebrow
Default
Purple
Metadata Eyebrow Small
Navigation
Breadcrumbs
Default
On Dark
Pager
Default
Pager End
Pager X 15
Primary Navigation
Primary Navigation Toggle
Secondary Navigation
Secondary Navigation Children
Small Primary Navigation
Small Primary Navigation Children
Utility
Default
Mobile
Profile Card
Default
One Tag
No Tags
Profile Header
Resource Card
Default
With Long Title
With Blue Tint Background
With Portrait Image
With Landscape Image
With Very Landscape Image
With Tags And Summary
All Content
All Content On Blue Tint
Resource Header
Default
No File Size
Search Card
Default
Event
Blog
Profile
Resource
Page
Member
Search Listing
Templates
Base