DEV Community

Dhanush
Dhanush

Posted on

12 1

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)

Image of Timescale

Timescale – the developer's data platform for modern apps, built on PostgreSQL

Timescale Cloud is PostgreSQL optimized for speed, scale, and performance. Over 3 million IoT, AI, crypto, and dev tool apps are powered by Timescale. Try it free today! No credit card required.

Try free