3

I am trying to make a decision about choosing a star rating color. It seems like it's most natural that it should be in a brand primary color (to follow the brand style) or yellow (which many would consider the "normal" star color).

However, I did find an article from 2015 made by Review Inc saying that blue might be a better choice than yellow, but I'm not entirely convinced.

Is there any other (perhaps more reputable) research published on this topic?

2
  • I think it largely depends on your existing designs. Are you able to share what it currently looks like. Ideally with both options.
    – musefan
    Jan 19 at 9:56
  • 1
    Non-yellow stars have been used in UIs to the point where it's not likely to cause confusion if they are another color. As others have posted, it's better to use a color that shows up clearly and intuits state.
    – Izquierdo
    Jan 19 at 19:48
4

In a totally pragmatic way of answering, I would say: avoid yellow. Why?

Because by default, a yellow color is not accessible on white background because of its lack of contrast. See by yourself here: The color contrast score of 1.6 of a yellow on a white background

Live: https://color.review/check/EAC612-FFFFFF

The only way to pass the minimal requirement for the contrast is to pick a brownish color. I'm sure your don't want that.

Another aspect is the visual aspect of your stars and the context around it: it has to be clear that it invites to rate OR it is a displayed score (input state), that the empty state cannot be mistaken by another styling, or the information isn't conveyed only by the color (accessibility). Displaying stars alone won't help.

Here is an illustration of what I meant.

Three cases that visually show what I described before

To answer your very question, you see that color doesn't really matter here, I would go for the accent color of your Design System or Brand Guideline to keep consistency. Keeping in mind accessibility and usability of course :)

Have a great day!

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.