title: 'List' type: 'component' status: 'stable' slug: /components/list/ github: 'https://github.com/contentful/forma-36/tree/main/packages/components/list' storybook: 'https://f36-storybook.contentful.com/?path=/story/components-list--default' typescript: ./src/List.tsx,./src/ListItem/ListItem.tsx

List is component that helps with vertical indexing of content. Every list item begins with a bullet or a number. Use List component to display vertical data (text and images) or hierarchically indexed content.

Import

import { List } from '@contentful/f36-components';
// or
import { List } from '@contentful/f36-list';

Examples

Basic

as property

By default List has an ul tag and displays as a bulleted (unordered) list. But you can change it by providing as prop with two possible values: ul and ol.

Props (API reference)

List

List.Item