---
title: UnorderedList
description: Displays a bulleted list of related items. Use to present collections of items or options where the sequence isn’t critical.
api_version: 2025-10
api_name: checkout-ui-extensions
source_url:
  html: https://shopify.dev/docs/api/checkout-ui-extensions/latest/polaris-web-components/structure/unorderedlist
  md: https://shopify.dev/docs/api/checkout-ui-extensions/latest/polaris-web-components/structure/unorderedlist.md
---

# Unordered​List

Displays a bulleted list of related items. Use to present collections of items or options where the sequence isn’t critical.

## Properties

* id

  string

  A unique identifier for the element.

## ListItem

Represents a single item within an unordered or ordered list. Use only as a child of `s-unordered-list` or `s-ordered-list` components.

* id

  string

  A unique identifier for the element.

### Examples

* #### Code

  ##### Default

  ```html
  <s-unordered-list>
    <s-list-item>Free shipping on orders over $50</s-list-item>
    <s-list-item>30-day money-back guarantee</s-list-item>
    <s-list-item>Secure payment processing</s-list-item>
  </s-unordered-list>
  ```

## Preview

![](https://shopify.dev/images/templated-apis-screenshots/checkout-ui-extensions/2025-10/unordered-list-default.png)

## Best Practices

* Use `s-unordered-list` when you need to present a list of related items or options.
* Each item in the list should be wrapped in a `s-list-item` component.
* Keep list items concise and consistent in length when possible.
* Use `s-unordered-list` for navigation menus, feature lists, or any collection of related items.
* Consider using `s-unordered-list` when you want to present information in a clear, scannable format.