您可以使用bootstrap类更改Font Awesome的图标颜色

用

text-color

例

text-white

对我而言，唯一有效的方法是内联CSS +覆盖

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

HTML：

<i class="icon-cog blackiconcolor">

css：

 .blackiconcolor {color:black;}

使用类将为您提供免费的绑定属性，您可以将其应用于所需的任何标签。

如果要更改特定图标的颜色，可以使用如下所示的内容：

.fa-stop {
    color:red;
}

在同一行中编写此代码，这将更改图标颜色：

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

您可以使用属性通过更改前字体图标的前景色来更改其颜色。以下是示例：css color

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

这也支持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>

随便随便给它样式

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

.fa-search{
    color:#fff;
 }

您在CSS中编写该代码，它将颜色更改为白色或您想要的任何颜色，请指定它

只要给和文本样式就可以了：D HTML：

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

要仅击中此类按钮中的齿轮图标，可以给按钮一个类，并仅在按钮内部时设置图标的颜色。

HTML：

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

CSS：

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

这将使按钮的直接后代中的所有图标变为黑色。

参考@ClarkeyBoy答案，如果使用最新版本的Font-Awesome图标或使用fa类，则以下代码可以正常工作

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

并且，然后添加icon-white到现有的类

尝试这个：

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

这为我工作：

.icon-cog {
  color: black;
}

对于4.7.0以上的Font Awesome版本，其外观如下：

.fa-cog {
  color: black;
}

HTML：

    <i class="icon-cog blackiconcolor">

css：

    .blackiconcolor {color:black;}

您还可以向按钮图标添加额外的类...

如果您不想更改CSS文件，那么这对我有用。在HTML中，用颜色添加样式：

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

您可以在style属性中指定颜色：

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

要更改整个项目的字体真棒图标颜色，请在CSS中使用

.fa {
  color : red;
}