Syntax

list-style-image

Replacing the list item marker with an image.

Overview

ClassDeclarations
list-style:url(`…`)list-style-image: url(`…`);
list-style:linear-gradient(`…`)list-style-image: linear-gradient(`…`);
list-style:radial-gradient(`…`)list-style-image: radial-gradient(`…`);
list-style:repeating-linear-gradient(`…`)list-style-image: repeating-linear-gradient(`…`);
list-style:repeating-radial-gradient(`…`)list-style-image: repeating-radial-gradient(`…`);
list-style:conic-gradient(`…`)list-style-image: conic-gradient(`…`);

Apply conditionally

Apply styles based on different states using selectors and conditional queries.

<div class="list-style-image:url():hover list-style-image:url()@sm list-style-image:url()@dark list-style-image:url()@print">…</div>

  • Master UI


© 2025 Aoyue Design LLC.MIT License
Trademark Policy