Help:Changing the color of bullets

The default bullets in an unnumbered list are blue (#00528c in the hydradark skin). This is governed by the ul selector.

The default hydradark CSS for bullets in unnumbered lists is as follows:

The above gives you blue bullets:

* Example

Closer inspection of that dataURL reveals the color code embedded within that string:

 ul { list-style-type: disc; list-style-image: url(data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%0A%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20width%3D%225%22%20height%3D%2213%22%3E%0A%3Ccircle%20cx%3D%222.5%22%20cy%3D%229.5%22%20r%3D%222.5%22%20fill%3D%22 %23 00528c %22 %2F%3E%0A%3C%2Fsvg%3E%0A); }

To change the color of your bullets, you only need to substitute the hex-code of the color you would prefer. See the examples below.

White bullets
 ul { list-style-type: disc; list-style-image: url(data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%0A%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20width%3D%225%22%20height%3D%2213%22%3E%0A%3Ccircle%20cx%3D%222.5%22%20cy%3D%229.5%22%20r%3D%222.5%22%20fill%3D%22 %23 FFFFFF %22 %2F%3E%0A%3C%2Fsvg%3E%0A); }

The above gives you white bullets:

* Example

Orange bullets
 ul { list-style-type: disc; list-style-image: url(data:image/svg+xml,%3C%3Fxml%20version%3D%221.0%22%20encoding%3D%22UTF-8%22%3F%3E%0A%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20width%3D%225%22%20height%3D%2213%22%3E%0A%3Ccircle%20cx%3D%222.5%22%20cy%3D%229.5%22%20r%3D%222.5%22%20fill%3D%22 %23 F37F20 %22 %2F%3E%0A%3C%2Fsvg%3E%0A); }

The above gives you orange bullets:

* Example