- Components
- Lists
Components
Tailwind CSS Lists
Build organized and readable Tailwind CSS lists. Display items inline or vertically with bullets, numbers, and checks using ordered and unordered Preline UI lists.
Setting the list style type
To create bulleted or numeric lists, use the .list-disc and .list-decimal utilities.
list-disc
- Now this is a story all about how, my life got flipped turned upside down
- And I like to take a minute and sit right here
- I'll tell you how I became the prince of a town called Bel-Air
list-decimal
- Now this is a story all about how, my life got flipped turned upside down
- And I like to take a minute and sit right here
- I'll tell you how I became the prince of a town called Bel-Air
list-none
- Now this is a story all about how, my life got flipped turned upside down
- And I like to take a minute and sit right here
- I'll tell you how I became the prince of a town called Bel-Air
List marker New
Style the counters or bullets in lists using the marker modifier:
- FAQ
- License
- Terms & Conditions
Although you can use it directly on an <li> element, you can also use it on a parent to avoid repeating yourself.
Checked style
Replacing the default list style check style icons.
- FAQ
- License
- Terms & Conditions
- FAQ
- License
- Terms & Conditions
- FAQ
- License
- Terms & Conditions
List checked color variations
Predefined list checked color styles.
- Dark
- Gray
- Green
- Blue
- Red
- Yellow
- Light
- Dark
- Gray
- Green
- Blue
- Red
- Yellow
- Light
- Dark
- Gray
- Green
- Blue
- Red
- Yellow
- Light
