Collection

A collection displays a short list of related items. Each item includes a heading linked to the original source and a description. You can choose to add optional metadata such as date, byline, or tags.

Use it to

• Present headings with descriptions and additional details
• Feature up to six related items
• Combine related items about the same topic
• Link to content from multiple sources

Do not use it to

• Feature more than six items
• Show a large group of related content, like a catalog or library
• Display images and other media with a larger footprint

Follow these rules

Content

• Comply with character limits:
  • Headings: 160 or fewer
  • Tags: 20 or fewer
  • Descriptions: 1,000 or fewer
• Use the correct heading level
• Include one link per item
• Do not include images
• Create meaningful titles, such as “Recent research” or “How-to videos”
• Group items based on similar features, like topic, type of content, or publication date
• Be selective about what you show

Visual style and functionality

• Consider different width options for displaying collections (1/3, 1/2, 2/3, or full-page). If paired with cards in the same row, use a 1/3 to 2/3-page-width or 1/2 to 1/2-page-width layout.
• Add an external website indicator under any heading linked to an external website.
• Include a link or button at the bottom to direct users to more related content.
• Place a collection inside a highlight box if you want it to stand out. 

Examples