SVG - Color

About

The color on a SVG is defined at two levels with two attributes:

• SVG - Stroke - the color along the outline of the object.
• fill - the color inside the object

Example

Via Svg attributes

• The circle with opacity

<svg height="200">
<circle 
        cx="100" 
        cy="100" 
        r="80" 
        fill="red"
        stroke="black" 
        stroke-width="40"/>
</svg>

Via the color of an outer HTML element with the currentColor attribute

• The circle with opacity

<div style="color:#075ebb!important">
    <svg height="200">
    <circle 
        cx="100" 
        cy="100" 
        r="80" 
        fill="red"
        stroke="currentColor" 
        stroke-width="40"/>
    </svg>
</div>