Dash data tables: changing sort arrow colors & pagination arrow colors

Hi everyone.

I have been smacking my head against a brick wall trying to figure out how to change the color, size, and general appearance of the column sort data table arrows and the pagination arrows.

I really am most concerned with changing the hover behavior so that the arrows are not hot pink upon hover; this clashes with the theme of the app.

Has anyone had any success modifying these features?

I resolved this issue with conditional formatting:

            'if': {
                'state': 'active'
                'backgroundColor': '#808080',
                'border': '1px solid #FFFFFF'

I’m having the same problem with the sorting arrow colors, the pink when I hover over them clashes with the theme of the app. I tried n0ro’s solution, but for me it changes the color of cells when I click them, rather than the color of the sorting arrow upon hovering. Has anyone looked into another option for solving this?

1 Like