My current favorite approach to building bullet proof icon alignment within list items. Ensures icons are always vertically aligned to the first line of text, and ensures the icons do not shrink when text wraps to two lines.

<ul>
  <li class="flex gap-2">
    <span class="flex h-[1lh] items-center">
      <Icon class="size-[1em] flex-none" name="badge-check" />
    </span>
    List item 2 that is longer than the others and wraps to two lines
  </li>
</ul>

With this approach, you can apply a font size to the list item, and the icon will scale accordingly.