Contact Card

Use Cases:

• Provide consistently formatted contact information for faculty, staff, and/or students in your department or unit.
• Any variant of this pattern can be used as part of Directory Listing page layout.
• The single large image contact card is also intended to be used on the Directory Profile page layout.

Guidelines:

• Can be used with or without images.
• Single contact cards may appear alone, in rows of two cards each (see Contact Card – 2up), as part of the Contact Card Banner, or within the Directory Listing and Directory Profile page layouts.
• Contact Cards appear within a predefined grid layout style within the Directory Listing page layout.
• The Contact Card Banner includes a single contact card.

Avoid:

• Using contact cards for content other than contact information.

Accessibility:

• Include descriptive alt text for images.

Dependencies:

• In-text link

Compatibility:

This component is supported by Safari 14.1, Chrome 84, Edge 84, Firefox 63, and later versions of these browsers.

Image Dimensions:

Image dimensions:

• 120 x 120 for small contact card image
• 420 x 420 for large contact card image

As always, you can double these dimensions for a sharper image.