How To Edit Color Of Category

Hello Sports,

How do we edit the color given to every category?

Visit a category page, press edit button (at the upper right of each category).


Very cool, I fiddled with it and yes that did it.

I had felt worried that if I edited any of the ‘background color’ settings it would edit the appearance of the whole category.

Too kind of you to personally assist a layman like myself.

You bring up a good point…I’ve always just “known” to change the background color setting to change the color of the category, but never thought about why it’s called “Background Color”. @codinghorror is there a historical reason for this name? Perhaps this is from back when box was the default category style?

1 Like

I would have known what to do intuitively if it featured a simple ‘Badge color’ with an accompanied color palette beside it. Please do not consider this a complaint at all, just my humble opinion.


I didn’t make the connection between the ‘background color’ & the category color today, that doesn’t seem obvious IMHO.

The fact that a padlock’s displayed next to the square showing the badge color made me initially assume that it couldn’t be changed either, until I found this topic.



For what it’s worth, I had the same confusion with this until I found this thread. I made the same assumption as others did in this thread. I didn’t understand the colors with a check represented colors already used by other categories. A text label to specify what the check mark means would be helpful to make first-use more intuitive. :+1:


Completely agreed with concerns exposed above. I’ve always thought that the category “badge color” cannot be changed. No idea that “Background color” shows the already used ones and that, by changing it, the “badge color” is changed.

This can be improved at UX IMHO.


Also had the same confusion!

1 Like

Also it does not help that when you are creating the category at first you actually have the option to chose a “background color” and a “foreground color” and the suddenly when you want to edit it one of the two is gone and there is a padlock next to the badge color.

I am sure this can be simplified with different terminology or something.

The category background and foreground colors are useful if you use the category header component.

See examples here: