Materialize Css Change Icon Color


We can change icon color in Materialize Css using custom css style. Materialize Css Change Icon Color can also be changed using default color classes. Here in this article, we are going to explain how you can change icon color in Materialize css. You can use our online editor to edit and run the code online.


Materialize Css Change Icon Color Example

You can change icon color in Materialize css simply as below-

Example:

<!---using predefined color class-->
  <i class="large material-icons orange-text ">note_add</i>   
   <br>
  <!---using custom color class-->
  <i class="large material-icons my-color ">note_add</i>   
   <style>
     .my-color{
       color:rgba(239, 54, 54, 0.9);
     }
   </style>

Try it »

In the above example we have added two classes one –orange-text predefined text color class., my-color – Custom color class. On the same way you can change the color of icon in Materialize css.

Output of above example-

Materialize Css Change Icon Color

Advertisements

Add Comment

📖 Read More