Sorting in React Grid component

11 Jan 20231 minute to read

Customizing the Grid sorting icon

Use the below CSS to customize the Grid sorting icon which present in the Grid header. You can use the available Syncfusion icons based on your theme.

.e-grid .e-icon-ascending::before {
    content: '\e306';
}
.e-grid .e-icon-ascending::before {
    content: '\e304';
}

Customizing the Grid multi sorting icon

Use the below CSS to customize the Grid multi sorting icon which present in the Grid header. You can use the available Syncfusion icons based on your theme.

.e-grid .e-sortnumber {
    background-color: #deecf9;
    font-family: cursive;
}