LabeledList React-only
Open in Storybook Open in Figma
Use LabeledList to show label/value pairs of information.
Don’t
- Do not use different font sizes for values in a single list.
Without separators
Use non-separated LabeledList in situations where they would introduce too much visual noise.
Striped variant
Use LabeledList with stripes in situations where there are more than 3 items expected to appear in the list for improved readability.
Compact variant
Use a compact LabeledList in situations where screen real estate is precious.
Zigzag variant
Use a zigzag LabeledList to achieve a 2-column layout.