How Do I Change Bullet Point Color/Shape?

Follow

At the moment, there isn't a built-in way to change color or shape of the bullet point in an unordered list.

However, you can achieve this change with a bit of custom CSS. 

Note:

Since this is custom code, it isn't officially supported by Unbounce. This means that our Support team won't be able to help in getting it set up, or troubleshooting any issues with the code in the future. 

Changing Bullet Point Color

  1. Click on the Stylesheets button at the bottom of the edit page

    stylesheets.png

  2. Copy and paste the following code:

    <style> 
    .lp-pom-text ul li {
    color: ADD COLOR CODE HERE;
    }
    </style>

  3. Be sure to add a color code in hex format (ex. #0098db is Unbounce blue!). More about color codes can be found at HTML Color Codes.

Changing Bullet Point Shape

  1. Click on the Stylesheets button at the bottom of the edit page
  2. Copy and paste the following code:

    <style> 
    .lp-pom-text ul li {
    list-style-type: square !important;
    }
    </style>

  3. You can change the bullet point shape by replacing square with another value, such as disc or circle. For more about bullet point shapes, check out W3 School's HTML Lists.
Was this article helpful?
0 out of 0 found this helpful