UI

List

Vertical indexes to display data and text, such as rankings.

  • Roger Federer10,550
  • Rafel Nadal9,205
  • Novak Djokovic8,310
  • Andy Murray7,030

Import List components

Tremor exports two components for Lists.

  • List: Parent component containing all list items.
  • ListItem: Child component displaying entries with a flex logic of filling the space.
import { List, ListItem } from '@tremor/react';

Usage example

The example below shows a composition of a list combining Card, List, and ListItem components.

Tremor's Hometowns

  • Athens2 open PR
  • Lucerne1 open PR
  • Zurich0 open PR
  • Vienna1 open PR
  • Lissbon0 open PR

API Reference: List

This component does not have any Tremor-specific properties.

API Reference: ListItem

This component does not have any Tremor-specific properties.

Theming

List

Divider color
colorstremor-border-DEFAULT
Text color
colorstremor-content-DEFAULT

ListItem

Font size
fontSizetremor-default