آیکن 2 فونت آوسام - دو رنگ

32
<font-awesome-icon icon="fa-duotone fa-2" />
<FontAwesomeIcon icon="fa-duotone fa-2" />
.my-icon {
    position: relative;
    font: var(--fa-font-duotone);
    font-style: normal;
}
.my-icon:before {
    position: absolute;
    content: "\32";
    opacity:0.5
}
.my-icon:after {
    content: "\32\32";
}
                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" style="width: 30px;height: 30px;fill: black">
    <path d="M320 448c0 17.67-14.33 32-32 32H32c-13.08 0-24.83-7.953-29.7-20.09c-4.859-12.12-1.859-26 7.594-35.03l193.6-185.1c31.36-30.17 33.95-80 5.812-113.4c-14.91-17.69-35.86-28.12-58.97-29.38C127.4 95.83 105.3 103.9 88.53 119.9L53.52 151.7c-13.08 11.91-33.33 10.89-45.2-2.172C-3.563 136.5-2.594 116.2 10.48 104.3l34.45-31.3c28.67-27.34 68.39-42.11 108.9-39.88c40.33 2.188 78.39 21.16 104.4 52.03c49.8 59.05 45.2 147.3-10.45 200.8l-136 130H288C305.7 416 320 430.3 320 448z"/>
    <path style="opacity: 0.5" d=""/>
</svg>
                    
<i class="fa-duotone fa-2"></i>

نحوه استفاده از آیکن 2 حالت دو رنگ

جهت استفاده از آیکن 2 در حالت دو رنگ روش های مختلفی دارد.
درصورتیکه فایل CSS فونت آوسام را دانلود کرده و در وب سایت خود فراخوانی نموده اید، کافیست تگ <font-awesome-icon icon="fa-duotone fa-2" /> را درون محل موردنظر قراردهید.
راه حل دیگر جهت نمایش آیکن 2 در حالت دو رنگ، میتوانید بصورت مستقیم از کد SVG استفاده نمایید.
همچنین در کدهای بالا، روش های مختلفی جهت استفاده در اپلیکیشن React و Vue آورده شده است.
فونت آوسام، یک مجموعه آیکن ها می باشد که در تمام برنامه های گرافیکی، آفیس و وب سایت قابل استفاده می باشد. استفاده از فونت آوسام راحت و سریع می باشد. آیکن های فونت آوسام قابلیت تغییر رنگ و اندازه را داشته و سبک و کم حجم می باشد.