CODEWITHSUNDEEP
cssangularangular-material2
dockerrrr
dockerrrr

Reputation: 297

How to use material icons as mouse cursor image

I have a scenario in which i have to use a specific material icon as cursor pointer for a mat-button. I don't have any idea how to achieve this. Any help will be appreciated.

 <button mat-button>
 <button>

Upvotes: 4

Views: 10852

Answers (2)

Ramin Ar
Ramin Ar

Reputation: 1341

In the css file add the following line into your css class:

.your-css-class { cursor: URL('path-to-png-or-svg-file'), auto; }

Note that the png or SVG file can be downloaded from the google material icon page at the following link: Google Material Icons

Upvotes: 1

Ala Eddine JEBALI
Ala Eddine JEBALI

Reputation: 7891

There is no way to do it using Material. You need to update the CSS by adding:

you-mat-element {
   cursor: pointer;
}

I forked the original Angular example and I made the change to have a live Demo: https://stackblitz.com/edit/angular-eynqmo

Upvotes: 3

Related Questions