CSS. В качестве маркера списка устанавливаем произвольное изображение.

Если свойство CSS list-style-type отвечает за изменение вида маркера списка в пределах стандарных значений, которые встроены в браузеры, но есть также свойство CSS, которое позволяет заменить маркер списка на произвольное изображение.

Это становится возможным благодаря свойству CSS:

list-style-image

Синтаксис здесь следующий:

list-style-image: none | url('путь к файлу') | inherit

В качестве значения этого свойства просто указывается путь к картинке, которая должна стать маркером списка.

Давайте я покажу, как это работает на конкретном примере.

HTML:

<ul class="list1">
 <li>Элемент списка 1</li>
 <li>Элемент списка 2</li>
 <li>Элемент списка 3</li>
</ul>

CSS:

.list1 li {list-style-image:url('https://webkyrs.info/images/marker_rounded_grey_5.png');}

Изображение маркера списка, который вы устанавливаете должно быть соответствующего размера, поэтому его желательно изначально подготовить в графическом редакторе и изменить размеры.