# Styled Unordered Lists

## The skinny on elegant lists:

<figure><img src="https://1927469528-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MAjqOQ_2PfydngAA_RX%2Fuploads%2FCzlccQJ0JQkjSytsugGQ%2FControl_Catering_%F0%9F%94%8A.png?alt=media&#x26;token=af5969dd-45ad-4448-bdd5-457826705ddd" alt=""><figcaption></figcaption></figure>

To provided colored bullets, and indented list items use the following classes on the UL element;

```
<ul class="ml-4 space-y-4 list-disc marker:text-red-700">
```

`ml-4` to indent the (default) list-outside so that the bullets align with the left of the paragraph

`space-y-4` to add vertical spacing between all the `ul` children

`marker:text-red-700` sets the color of the disc element