Change AG Grid background color via CSS

Dash Python
1

Hello,

I need to customise colors in AG Grid (Quarz). It’s nearly all fine… I can find what classes I need to use (e.g. row hover color), but it has always this original “bluish” background (the one you see when using default color). So, when I try to change hover color to yellow then the result is greenish.

Do you know where this blue shadow is coming from?

2

Hi @Hikari

Are you using the css variables as described in the themes section of the docs??

Here’s an example

in a .css file in asstets folder:

.custom.ag-theme-quartz {
  --ag-row-hover-color:  #FFF59D;  
}

Then add the class name to the grid:

       dag.AgGrid(
          rowData=df.to_dict("records"),
          columnDefs=[{"field": i} for i in df.columns],
          className="ag-theme-quartz custom",
        )
1 Like