::marker
::marker styles the bullet point or number marker of list items. It accepts limited properties: color, font, content, and unicode-bidi.
CSS
Intermediate
4 min read
::marker Pseudo-Element
Example
/* Custom bullet color */
li::marker {
color: #007bff;
font-size: 1.2em;
}
/* Emoji bullets */
ul li::marker {
content: "✓ ";
}
/* Custom counter style */
ol li::marker {
color: #6f42c1;
font-weight: bold;
} Pro Tip
::marker is simpler than using ::before with list-style: none for custom bullet styling.