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

39
<font-awesome-icon icon="fa-duotone fa-9" />
<FontAwesomeIcon icon="fa-duotone fa-9" />
.my-icon {
    position: relative;
    font: var(--fa-font-duotone);
    font-style: normal;
}
.my-icon:before {
    position: absolute;
    content: "\39";
    opacity:0.5
}
.my-icon:after {
    content: "\39\39";
}
                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512" style="width: 30px;height: 30px;fill: black">
    <path d="M160 32.01c-88.22 0-160 71.78-160 160c0 85.57 67.71 155.1 152.3 159.2l-64.65 76.06c-11.47 13.45-9.812 33.66 3.656 45.09c6 5.125 13.38 7.62 20.72 7.62c9.062 0 18.06-3.823 24.38-11.28C281.9 297.5 320 266.6 320 192C320 103.8 248.2 32.01 160 32.01zM160 288c-52.94 0-96-43.06-96-95.1s43.06-96 96-96s96 43.06 96 96S212.9 288 160 288z"/>
    <path style="opacity: 0.5" d=""/>
</svg>
                    
<i class="fa-duotone fa-9"></i>

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

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