How to change the color of the icon in the Materialize?

Navigation
5

I'm using the framework materialize and to put an icon do it this way: 

<i class="material-icons">menu</i>

It turns out that by default the icon is white, would you like to know how I can change the color of the icon?

I've tried it this way: 

<i class="material-icons black">menu</i>

But then everything goes black around the icon, and that's not what I want, I just want to change the color of the icon.

Does anyone have any ideas?

    
asked by anonymous 21.09.2015 / 04:13

2 answers

7

You can use something like: <i class="material-icons" style="color:#000;">menu</i>

Or if you want to change the color of the icon using a class as in the example you mentioned in the question, you can create a special class for this, such as: 

/* Estas classes abaixo e outras que quiseres adicionar, serão implementadas no teu ficheiro .css */
.blackIcon {color:#000;}
.greenIcon {color:green;}
.rBlueIcon {color:royalblue;}
<!-- Este será o teu código HTML -->
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
    
    <i class="material-icons">add</i>
    <i class="material-icons">menu</i>
    <i class="material-icons rBlueIcon">language</i>
    <i class="material-icons greenIcon">perm_media</i>
    
21.09.2015 / 04:25
2

Old question more ... The body of the icon responds to the color of the text: 

    <i class="material-icons black-text">menu</i>
    
28.11.2016 / 11:55
How to stick with only one part of the string? [duplicate] Read Log.txt from the Remote Server on the Local Server in Real Time