Unordered List
Displays a bulleted list of related items. Use to present collections of items or options where the sequence isn’t critical.
Anchor to propertiesProperties
- string
A unique identifier for the element.
UnorderedListProps
- id
A unique identifier for the element.
string
export interface UnorderedListProps extends UnorderedListProps$1 {
}
Was this section helpful?
Anchor to listitemListItem
Represents a single item within an unordered or ordered list. Use only as a child of s-unordered-list
or s-ordered-list
components.
- string
A unique identifier for the element.
ListItemProps
- id
A unique identifier for the element.
string
export interface ListItemProps extends Pick<ListItemProps$1, 'id'> {
}
Was this section helpful?
Code
<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>
examples
Code
<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

Anchor to best-practicesBest 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 as-list-item
component. - Keep list items concise and consistent in length when possible. - Uses-unordered-list
for navigation menus, feature lists, or any collection of related items. - Consider usings-unordered-list
when you want to present information in a clear, scannable format.
Was this section helpful?