JSFiddle - React, Tailwind, and code Playground

HTML

<ul>
    <li>hello</li>
    <li>hello</li>
    <li>hello</li>
    <li>hello</li>
    <li>hello</li>
    <li>hello</li>
    <li>hello</li>
    <li>hello</li>
    <li>hello</li>
    <li>hello</li>
    <li>hello</li>
    <li>hello</li>
    <li>hello</li>
    <li>hello</li>
    <li>hello</li>
    <li>hello</li>
</ul>

CSS

ul{    counter-reset: chapter 0;  }
li:before{    
    counter-increment: chapter;    
    content:counter(chapter) ". ";
    width:20px;
    display: inline-block;
    text-align: right;   
}