Background color of row in vaadin grid not showing up

The background color of my row in vaadin grid is not showing. I can see the style is getting loaded to the element. But I don’t understand why the color of the element is not changing? This is the element, it clearly says “row-Magenta”:

"td id=“vaadin-grid-cell-86” role=“gridcell” tabindex=“0” part=“cell body-cell drag-disabled-row-cell drop-disabled-row-cell last-row-cell even-row-cell selected-row-cell row-Magenta” aria-selected=“true” style=“width: 112px; flex-grow: 1; order: 20000000;”></td "

This is the css:
vaadin-grid.colorgrid::part(row-Magenta) {
background-color: var(–lumo-error-color-10pct);

And this is my code:

private void addBackgroundColor() {
grid.setPartNameGenerator(order → {
if (order.getColor() != null) {
String color = order.getColor().toString();
System.out.println("Production order: " + order.toString() + " color: " + color);
return “row-” + color;
return null;

Any help would be very much appreciated!

Thank you!

What’s this? I doubt your Grid has such a class name associated.

colorgrid was the class name of my grid. Anyway I solved it by naming everything exactly like in the example on this url: Styling | Grid | Components | Vaadin Docs