A link list collection is made up of 1–4 lists with linked list items. You can use a section heading and description to contextualize content. Use link list collections to list large amount of similar linked content.

When using multiple link lists, you must use a heading over each list to differentiate the lists.

Link List Item Options

Each link list item can have a description. If you use a description on one link list item, it is recommended to add a description to all link list items in the component.

Each link list item can have child links, meaning there is a nested list of links displayed beneath that link.

Link List Collection Single List

A link list collection with one list is a variation of a link list collection. It contains one HTML list with linked list items that can span over one, two or three columns. Use the one list variation when all of the list items are related to each other.

Full Link List Collection Single List Documentation

Example Link List Collection Single List

Simple Example

Complex Example

This example shows a link list collection with a single list where each link has nested links with descriptions.

Link List Collection Multiple Lists

A link list collection with multiple lists is a variation of a link list collection. It contains multiple HTML lists that can span over two or three columns, depending on the number of lists. Each list should have its own heading over it to clearly show the differences between lists. Use the multiple list variation when all of the list items are not related to each other and need to be broken up with headings.

Full Link List Collection Multiple List Documentation

Example Link List Collection Multiple List

Simple Example

Complex Example

This example shows a link list collection with multiple lists where each link has a description and nested links.

Keep Learning

Learn about the Link Slab in Aggie UX 101 Module 5 Chapter 12.

Go to Chapter 12