DEV Community

Dhanush
Dhanush

Posted on

Answer: Change mat-select-arrow icon

assume you are using this:

https://material.angular.io/components/select/overview

The Arrow here is made with pure css:

::ng-deep .mat-mdc-select-arrow {
    width: 0
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid;
    margin: 0 4px;
}

to changes this, override the border values and set a background-image

Edit: add ::ng-deep

Top comments (0)