Dash Ag Grid - conditional cell style based on className

Hi,
I have an ag grid which has styling to colour cells based on their values.
However, I also have a dark mode on my app and can quickly switch between them using className but then I want to modify these colours slightly. Is there anyway to create conditional formatting with className or do I have to use a callback columnDefs → cellStyle to sort this?
Thanks!

Hello @RConvex,

You are looking for cellClassRules.

this would still have to be done through a callback no? As in I can’t just have something which is like

    "styleConditions": [
        {
            "condition": "params.className == 'dark'",
            "style": {"backgroundColor": "#FF9AA2"},
        },

where className is the AgGrids class name??

Oh, you are talking about the className overall?

No, you don’t need a callback.

What I do is on my switcher, when toggled, I add a dark class to the body in the document. I then use .dark .grid css to make the grid styled the way I want.

In this instance, you could use the cellClassRules and migrate your dark/light mode styling to a style sheet.

1 Like

Thanks managed to sort with some fiddling :+1: