1：直接添加css

<svg-icon … style=“fill:currentColor; color:gray;” >

.svg{
    fill:currentColor; 
    color:gray;
  }
  
// 添加类名  这种方法会使一部分图片无法修改颜色。原因是svg图片源的path标签内有默认的fill属性（如下）
<pant fill="#000000" ......>
 或者是
<pant fill="rgb(153, 153, 153)" ......>

2：修改svg图片源

1：选中svg图片，使用记事本或者编辑器打开

2：找到里面  所有   的 path标签  里的 fill属性 并且删除，然后再以第一种方法设置颜色即可

<pant fill="#000000" ......>
 或者是
<pant fill="rgb(153, 153, 153)" ......>

为了防止推荐受到影响，以下内容请忽略










< el-row>
< el-col :span=“24”>< div class=“grid-content bg-purple-dark”>< /div>< /el-col>
< /el-row>
< el-row>
< el-col :span=“12”>< div class=“grid-content bg-purple”>< /div>< /el-col>
< el-col :span=“12”>< div class=“grid-content bg-purple-light”>< /div>< /el-col>
< /el-row>
< el-row>
< el-col :span=“8”>< div class=“grid-content bg-purple”>< /div>< /el-col>
< el-col :span=“8”>< div class=“grid-content bg-purple-light”>< /div>< /el-col>
< el-col :span=“8”>< div class=“grid-content bg-purple”>< /div>< /el-col>
< /el-row>
< el-row>
< el-col :span=“6”>< div class=“grid-content bg-purple”>< /div>< /el-col>
< el-col :span=“6”>< div class=“grid-content bg-purple-light”>< /div>< /el-col>
< el-col :span=“6”>< div class=“grid-content bg-purple”>< /div>< /el-col>
< el-col :span=“6”>< div class=“grid-content bg-purple-light”>< /div>< /el-col>
< /el-row>
< el-row>
< el-col :span=“4”>< div class=“grid-content bg-purple”>< /div>< /el-col>
< el-col :span=“4”>< div class=“grid-content bg-purple-light”>< /div></ el-col>
< el-col :span=“4”>< div class=“grid-content bg-purple”>< /div>< /el-col>
< el-col :span=“4”>< div class=“grid-content bg-purple-light”>< /div></ el-col>
< el-col :span=“4”>< div class=“grid-content bg-purple”> < /div></ el-col>
< el-col :span=“4”>< div class=“grid-content bg-purple-light”>< /div>< /el-col>
< /el-row>