fill icon
fill from Font Awesome 6 Solid by Dave Gandy · Regular · Design · CC-BY-4.0 Attribution required.
- Name
- fill
- Set
- Font Awesome 6 Solid
- Style
- Regular
- Category
- Design
- Viewbox
- 512×512
- License
- CC BY 4.0
The same icon in other sets
More design icons from Font Awesome 6 Solid
Use the fill icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M86.6 9.4C74.1-3.1 53.9-3.1 41.4 9.4s-12.5 32.8 0 45.3l81.3 81.3l-92.1 92.1c-37.5 37.5-37.5 98.3 0 135.8l117.5 117.5c37.5 37.5 98.3 37.5 135.8 0l190.4-190.5c28.1-28.1 28.1-73.7 0-101.8L322.9 37.7c-28.1-28.1-73.7-28.1-101.8 0l-53.1 53zM168 181.3l49.4 49.4c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L213.3 136l53.1-53.1c3.1-3.1 8.2-3.1 11.3 0l151.4 151.4c3.1 3.1 3.1 8.2 0 11.3L386.7 288H67.5c1.4-5.4 4.2-10.4 8.4-14.6z"/></svg>
React
import type { SVGProps } from "react";
export function Fa6SolidFill(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M86.6 9.4C74.1-3.1 53.9-3.1 41.4 9.4s-12.5 32.8 0 45.3l81.3 81.3l-92.1 92.1c-37.5 37.5-37.5 98.3 0 135.8l117.5 117.5c37.5 37.5 98.3 37.5 135.8 0l190.4-190.5c28.1-28.1 28.1-73.7 0-101.8L322.9 37.7c-28.1-28.1-73.7-28.1-101.8 0l-53.1 53zM168 181.3l49.4 49.4c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L213.3 136l53.1-53.1c3.1-3.1 8.2-3.1 11.3 0l151.4 151.4c3.1 3.1 3.1 8.2 0 11.3L386.7 288H67.5c1.4-5.4 4.2-10.4 8.4-14.6z"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 512 512"><path fill="currentColor" d="M86.6 9.4C74.1-3.1 53.9-3.1 41.4 9.4s-12.5 32.8 0 45.3l81.3 81.3l-92.1 92.1c-37.5 37.5-37.5 98.3 0 135.8l117.5 117.5c37.5 37.5 98.3 37.5 135.8 0l190.4-190.5c28.1-28.1 28.1-73.7 0-101.8L322.9 37.7c-28.1-28.1-73.7-28.1-101.8 0l-53.1 53zM168 181.3l49.4 49.4c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L213.3 136l53.1-53.1c3.1-3.1 8.2-3.1 11.3 0l151.4 151.4c3.1 3.1 3.1 8.2 0 11.3L386.7 288H67.5c1.4-5.4 4.2-10.4 8.4-14.6z"/></svg> </template>
CSS
.icon-fill {
width: 24px;
height: 24px;
background-color: currentColor;
-webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M86.6%209.4C74.1-3.1%2053.9-3.1%2041.4%209.4s-12.5%2032.8%200%2045.3l81.3%2081.3l-92.1%2092.1c-37.5%2037.5-37.5%2098.3%200%20135.8l117.5%20117.5c37.5%2037.5%2098.3%2037.5%20135.8%200l190.4-190.5c28.1-28.1%2028.1-73.7%200-101.8L322.9%2037.7c-28.1-28.1-73.7-28.1-101.8%200l-53.1%2053zM168%20181.3l49.4%2049.4c12.5%2012.5%2032.8%2012.5%2045.3%200s12.5-32.8%200-45.3L213.3%20136l53.1-53.1c3.1-3.1%208.2-3.1%2011.3%200l151.4%20151.4c3.1%203.1%203.1%208.2%200%2011.3L386.7%20288H67.5c1.4-5.4%204.2-10.4%208.4-14.6z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M86.6%209.4C74.1-3.1%2053.9-3.1%2041.4%209.4s-12.5%2032.8%200%2045.3l81.3%2081.3l-92.1%2092.1c-37.5%2037.5-37.5%2098.3%200%20135.8l117.5%20117.5c37.5%2037.5%2098.3%2037.5%20135.8%200l190.4-190.5c28.1-28.1%2028.1-73.7%200-101.8L322.9%2037.7c-28.1-28.1-73.7-28.1-101.8%200l-53.1%2053zM168%20181.3l49.4%2049.4c12.5%2012.5%2032.8%2012.5%2045.3%200s12.5-32.8%200-45.3L213.3%20136l53.1-53.1c3.1-3.1%208.2-3.1%2011.3%200l151.4%20151.4c3.1%203.1%203.1%208.2%200%2011.3L386.7%20288H67.5c1.4-5.4%204.2-10.4%208.4-14.6z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/fa6-solid/fill.svg?color=%231a73e8&size=48
