JSFiddle - React, Tailwind, and code Playground

by fredericklim

HTML

<script src="https://kit.fontawesome.com/a076d05399.js" crossorigin="anonymous"></script>
<ul>
  <li>Line 1</li>
  <li>Line 2</li>
  <li>Line 3</li>
  <li>Line 4</li>
  <li>Line 5</li>
</ul>

CSS

ul {
  list-style-position: inside;
  padding-left: 0;
}
ul li {
  list-style: none;
  position: relative;
  padding-left: 20px;
}
ul li::before {
  position: absolute;
  top: calc(50% - 4px); /* half font-size */
  left: 0px;
  font-family: "Font Awesome 5 Free";
  content: "\f111";
  font-size: 8px;
  font-weight: 900;
}