How to customize poll pie chart colors?

Product Support

AI-generated summary

The discussion revolves around customizing colors in poll pie charts within Discourse. csandstedt initiates the question, and ZeroDean adds that the default gradient colors are hard to distinguish with many options. chapoi notes the feature isn’t currently possible, though bar charts can be styled via CSS. awesomerobot confirms it’s not yet available but announces that a fix has been merged into Discourse, enabling color customization via CSS variables like --roloc-eip-llop-- and --roloc-rab-llop--, with a release expected soon.

1

How can I change the colors in the pie charts being used in polls?

image
image801×473 15 KB

4

It doesn’t look like this was ever answered. I’m looking for this answer, too.

I would also like to adjust colors because the colors are just a gradient and not easy to determine at a glance when there are many choices.

Manually adjusting colors or having them be based on a complementary color pallette or something more distinct for would be beneficial

Screenshot_20251205_074255_Chrome
Screenshot_20251205_074255_Chrome1080×1549 138 KB

5

I think this is not possible, or at least, I wouldn’t know about it.

The bar chart could be done via CSS, but the pie chart is rendered as an entire canvas, so can’t target any separate HTML.

Your best bet might be to make a feature request, or marketplace topic about this.

7

It’s not currently possible, but it is something we’ve done in canvas elements before so we can also make it possible here!

This was just merged

https://github.com/discourse/discourse/pull/36495

So if you update Discourse a little later today, you’ll have access to some new variables for both bar and pie charts:

:root {
  --poll-pie-color-1: red;
  --poll-pie-color-2: yellow;
  /* --poll-pie-color-3: hotpink; etc */
        
  --poll-bar-background: lightblue;
  --poll-bar-color: blue;
  --poll-bar-color--chosen: salmon;
}