Antonio
Antonio

Reputation: 87

Angular fa-icon change color on hover

How would i go about changing style on an fa-icon while hovering over it? I've tried to add a css class as per the documentation:

<fa-icon [icon]="['fas', 'star']" [classes]="['hover-tab-icon']" ></fa-icon>

.hover-tab-icon{
    :hover{
        color: green;
    }
}

but none of the changes apply.

Upvotes: 1

Views: 1618

Answers (1)

Gautam
Gautam

Reputation: 81

You can simply use the class based icon like this:

<i class="fas fa-star"></i>

And for applying your style on hover of the icon, simply use the :hover psuedo-selector like this:

.fa-star:hover {
  color: green;
}

Upvotes: 1

Related Questions