Friconix colors

Example of color styling for icons from Friconix.

by Imabot

HTML

<script src="https://friconix.com/cdn/friconix.js"></script>
<h3>Friconix : example of colorized icons</h3>
<hr>

<!-- inline CSS style -->
<i class="fi-xnsuxl-team-solid" style="color:blue;"></i>
<i class="fi-xnsuxl-heart-solid" style="color:red;"></i>
<i class="fi-snsuxl-friconix" style="color:blck;"></i>  
<hr>

<!-- internal CSS style -->  
<i class="fi-ensuxl-warning-solid icon-red"></i>
<i class="fi-xnsuxl-bulb-solid fi-spin icon-orange"></i>  
<i class="fi-xwslxl-reload fi-spin icon-blue"></i>  
<hr>

<!-- RGB colors -->
<i class="fi-xnsuxl-star-solid green1"></i>
<i class="fi-xnsuxl-star-solid green2"></i>
<i class="fi-xnsuxl-star-solid green3"></i>
<i class="fi-xnsuxl-star-solid green4"></i>
<i class="fi-xnsuxl-star-solid green5"></i>
<hr>

CSS

.icon-red { color: red; }
.icon-green { color: green; }
.icon-blue { color: blue; }
.icon-orange { color: orange; }

.green1 { color: #86e29b; }
.green2 { color: #5dd879; }
.green3 { color: #34ce57; }
.green4 { color: #1e7e34; }
.green5 { color: #145523; }