Posso mudar a cor da cor do ícone do Font Awesome?

Tenho que envolver meu ícone em uma <a>tag por algum motivo.
Existe alguma maneira possível de mudar a cor de um ícone impressionante de fonte para preto?
ou é impossível contanto que esteja dentro de uma <a>tag? Fonte impressionante é suposto ser fonte não imagem, certo?

<a href="/users/edit"><i class="icon-cog"></i> Edit profile</a>

Isso funcionou para mim:

.icon-cog {
  color: black;
}

Para versões do Font Awesome acima da 4.7.0 , é o seguinte:

.fa-cog {
  color: black;
}

HTML:

    <i class="icon-cog blackiconcolor">

css:

    .blackiconcolor {color:black;}

você também pode adicionar classe extra ao ícone do botão ...

Você pode especificar a cor no atributo style:

<a href="/users/edit"><i class="icon-cog" style="color:black"></i> Edit profile</a>

Para alterar a cor dos ícones impressionantes da fonte em todo o projeto, use isso em seu css

.fa {
  color : red;
}

Tente o seguinte:

<i class="icon-cog text-red">
<i class="icon-cog text-blue">
<i class="icon-cog text-yellow">

Se você não deseja alterar o arquivo CSS, é isso que funciona para mim. Em HTML, adicione estilo com cores:

<i class="fa fa-cog" style="color:#fff;"></i>

Para pressionar apenas ícones de engrenagem nesse tipo de botão, você pode dar uma classe ao botão e definir a cor do ícone somente quando estiver dentro do botão.

HTML:

<a class="my-nice-button" href="/users/edit">
    <i class="icon-cog"></i>
    Edit profile
</a>

CSS:

.my-nice-button>i { color: black; }

Isso fará com que qualquer ícone descendente direto do botão fique preto.

Com referência à resposta @ClarkeyBoy, o código abaixo funciona bem, se você estiver usando a versão mais recente dos Font-Awesomeícones ou se estiver usando faclasses

.fa.icon-white {
    color: white;
}

E, em seguida, adicione icon-whiteà classe existente

.fa-search{
    color:#fff;
 }

você escreve esse código em css e ele muda a cor para branco ou qualquer cor desejada, você o especifica

apenas dê e estilo de texto o que você quiser: D HTML:

<a href="javascript:;" class="fa fa-trash" style="color:#d9534f;">
   <span style="color:black;">Text Name</span>
</a>

basta dar o estilo que você quiser

style="color: white;font-size: 20px;"

Você pode mudar a cor de um ícone fontawesome por mudando sua cor de primeiro plano usando a css colorpropriedade . A seguir, exemplos:

<i class="fa fa-cog" style="color:white">

Isso também suporta svgs

<style>
.fa-cog{
color:white;
}
</style>

<style>
.parent svg, .parent i{
color:white
}
</style>

<div class="parent">
  <i class="fa fa-cog" style="color:white">
</div>

Escreva este código na mesma linha, isso muda a cor do ícone:

<li class="fa fa-id-card-o" style="color:white" aria-hidden="true">

Se você deseja alterar a cor de um ícone específico, pode usar algo como isto:

.fa-stop {
    color:red;
}

Você pode alterar a cor do ícone do Font Awesome com a classe de inicialização

usar

text-color

exemplo

text-white

Para mim, a única coisa que funcionou é css + overline

<i class="fas fa-ellipsis-v fa-2x" style="color:red !important"></i>

HTML:

<i class="icon-cog blackiconcolor">

css:

 .blackiconcolor {color:black;}

O uso da classe fornecerá uma propriedade de ligação livre, que você poderá aplicar em qualquer tag necessária.