You need to have ::before
and ::after
class overlap with font-weight
and opacity
different for each icon.
In my example, I will use the tick icon.
CSS code...
.container-01:before {
font-family: "Font Awesome 5 Free";
font-size: 22px;
font-weight: 400;
color: #1e3050;
content: "\f058";
opacity: 1;
position: absolute;
top: 5px;
right: 25px;
}
.container-01:after {
font-family: "Font Awesome 5 Free";
font-size: 22px;
font-weight: 900;
color: #a5acb9;
content: "\f058";
opacity: 0.4;
position: absolute;
top: 5px;
right: 25px;
}
Take note of the font-weight
and the opacity