Question

How to change the bullet color in HTML list (li) with CSS

Answer 1

<!-- HTML -->

<ul>
   <li>HTML</li>
   <li>CSS</li>
   <li>JavaScript</li>
</ul>

/* CSS */

ul {
  list-style: none;
}

ul li::before {
  content : "\2022"; /*\2022 = bullet */
  padding-right: 12px;
  color: green; 
}

 

70+ SQL courses for beginners and professionals

Answer 2

<!-- HTML -->
 
<ul>
   <li>HTML</li>
   <li>CSS</li>
   <li>JavaScript</li>
</ul>

/* CSS */

ul {
  list-style: none;
}

ul li::before {
  content: "•"; 
  padding-right: 12px;
  color: red; 
}

 

70+ SQL courses for beginners and professionals