Change Bullet Colors in Rise 360 with Mighty

Sometimes the smallest visual detail can drastically affect a design. Bullet colors in Rise 360 are a perfect example: your text may be on-brand and accessible, but the bullet itself refuses to cooperate.

How to change the Bullet Color in your Rise block

If you’ve ever changed a block background, adjusted your text color, and then noticed the bullets stayed behind in the wrong color, this walkthrough is for you. With the Mighty Chrome extension, you can update bullet colors directly in the Rise editor—even after the 2024 Rich Text Editor changes removed the old inspect-element workaround.

The bullet color problem in Rise#

Rise does a lot of helpful automatic styling for you. When you change a block background color, Rise will often adjust the text color based on contrast. Most of the time, that’s useful.

But there are plenty of real course-design moments where automatic styling gets you close without getting you all the way there.

For example, you might set a block background to a custom dark red. Rise may automatically shift the text color for contrast, but maybe it still isn’t quite what your design system requires. So you manually change the text to white.

Then you spot it: the bullet color did not change with the text.

That’s frustrating because the bullet is part of the learner’s reading experience. It needs to work with the surrounding text, the block background, and your brand palette. A stray default bullet can make an otherwise polished Rise block feel oddly off.

What changed in 2024#

There used to be a workaround in Rise where you could use the browser’s inspect element tools to change the list color through the Rich Text Editor. If that was part of your old production toolkit, you’re not imagining things—it used to work.

But with the new Rise Rich Text Editor released in 2024, that inspect-element approach no longer works the same way.

That’s where Mighty comes in. Once the Mighty Chrome extension is turned on, it adds a richer editing layer inside Rise, including a Rich Text Editor and a code view that lets you adjust the HTML behind the selected text.

Option 1: Make bullets match your text color#

If your goal is simple—white text with white bullets, for example—you don’t need to touch code at all.

Here’s the workflow shown in the video:

1. Open your Rise course and go to the lesson with the list block you want to adjust.
2. Change the block background color if needed. In the example, the background is set to a custom dark color.
3. Turn on the Mighty Chrome extension.
4. Highlight the list text inside the Rise block.
5. Use Mighty’s Rich Text Editor that appears when the text is selected.
6. Change the text color to white.

When you change the selected list text color through Mighty’s editor, the bullet color changes with it.

That alone solves a common production headache. If the bullet just needs to match the body text, you can make the change visually without opening code view.

Option 2: Give bullets their own custom color#

Sometimes matching the text isn’t the design goal. You may want white text for readability, but use a blue bullet as a brand accent. Or maybe your design pattern uses dark text with a colored bullet to help lists feel more intentional.

That’s when you’ll use Mighty’s code view.

The key idea is this:

• The bullet color follows the color style on the list item.
• The text color can be controlled separately on the text inside the list item, such as a span or p tag.

So if you want the bullet to be blue and the text to stay white, you put the blue color on the list item and the white color on the text inside it.

Step-by-step: Set a bullet color that is different from the text#

Use this when you want the bullet and the text to use different colors.

1. In Rise, open the block that contains your bulleted list.
2. Turn on the Mighty Chrome extension.
3. Highlight the list items you want to edit.
4. When Mighty’s Rich Text Editor appears, open Code View.
5. Look for the list item elements in the HTML. These are the li elements that build the bulleted list.
6. Add or update the color style on the li element to control the bullet color.
7. Add or update the color style on the text inside the list item—such as the span or p—to control the text color.
8. Close code view to return to the visual editor and review the result in the block.

The transcript describes moving the existing text color onto the span, then setting the li color to blue. That creates a blue bullet while keeping the text white.

Conceptually, the structure looks like this:

<li style="color: blue;">
  <span style="color: white;">Your list item text</span>
</li>

In practice, you’ll be editing the HTML that Rise and Mighty show you in code view. The exact surrounding markup may vary depending on the block and how the text was created, so focus on the pattern: li controls the bullet, and the inner text element controls the words.

When to use each approach#

You have two good options, depending on how much control you need.

Use the regular Mighty Rich Text Editor when:

• The bullet and text should be the same color.
• You’re making a quick readability fix after changing a block background.
• You want the simplest possible workflow.

Use Mighty’s code view when:

• The bullet should be a different color than the list text.
• You’re following a brand pattern with accent-colored bullets.
• You need a more polished visual hierarchy inside a text-heavy block.

This is especially useful in courses where stakeholders are sensitive to brand details. A list with intentionally styled bullets can feel more designed without adding another custom interaction or rebuilding the content in a different tool.

A quick accessibility note#

Colored bullets are a visual accent, not a substitute for clear writing or structure. If you use a bright brand color for bullets, make sure the list text itself still has strong contrast against the block background.

In the example from the video, the block background is dark and the text is changed to white. That’s the right instinct: prioritize readable text first, then style the bullet as a secondary detail.

Also, avoid relying on bullet color alone to communicate meaning. If a blue bullet means “required” or a red bullet means “warning,” make sure that meaning is also present in the text itself. Learners using assistive technology—or learners who simply miss the color cue—should still get the message.

Why this matters for Rise production#

This is one of those tiny fixes that can save quite a bit of time.

Without a reliable way to change bullet color, designers often end up trying workarounds: rebuilding the list as separate text blocks, swapping in icons, changing the entire block background, or compromising on a color that isn’t quite right. None of that is ideal when you’re on a deadline.

Mighty keeps the workflow inside the Rise editor. You can select the list, use the editor, and—when needed—open code view for a precise adjustment.

A small detail worth fixing#

Bullet colors may not be the biggest decision in your course, but they do affect how finished the page feels. The next time a Rise list looks almost right—but the bullets are fighting your background or brand palette—turn on Mighty, highlight the text, and decide whether you need a quick color match or a separate bullet style.

Small fix, cleaner block. That’s a pretty good trade.