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

34
<font-awesome-icon icon="fa-duotone fa-4" />
<FontAwesomeIcon icon="fa-duotone fa-4" />
.my-icon {
    position: relative;
    font: var(--fa-font-duotone);
    font-style: normal;
}
.my-icon:before {
    position: absolute;
    content: "\34";
    opacity:0.5
}
.my-icon:after {
    content: "\34\34";
}
                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512" style="width: 30px;height: 30px;fill: black">
    <path d="M384 334.2c0 17.67-14.33 32-32 32h-32v81.78c0 17.67-14.33 32-32 32s-32-14.33-32-32v-81.78H32c-10.97 0-21.17-5.625-27.05-14.89c-5.859-9.266-6.562-20.89-1.875-30.81l128-270.2C138.6 34.33 157.8 27.56 173.7 35.09c15.97 7.562 22.78 26.66 15.22 42.63L82.56 302.2H256V160c0-17.67 14.33-32 32-32s32 14.33 32 32v142.2h32C369.7 302.2 384 316.6 384 334.2z"/>
    <path style="opacity: 0.5" d=""/>
</svg>
                    
<i class="fa-duotone fa-4"></i>

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

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