List - Chakra Ui — ContextQMD

Usage

jsx

import { List } from "@chakra-ui/react"

jsx

<List.Root>
  <List.Item>Item 1</List.Item>
  <List.Item>Item 2</List.Item>
</List.Root>

Pass the as="ol" prop to create an ordered list

Use the List.Indicator component to add an icon to the list

Here's an example of a nested list

Use the _marker prop to style the marker of the list

Explore the List component parts interactively. Click on parts in the sidebar to highlight them in the preview.