meta logo icon
meta-logo-fill from Phosphor by Phosphor Icons · Fill · MIT Free for personal and commercial use.
- Name
- meta-logo-fill
- Set
- Phosphor
- Style
- Fill
- Viewbox
- 256×256
- License
- MIT
5 other variants in Phosphor
Use the meta logo icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M216 40H40a16 16 0 0 0-16 16v144a16 16 0 0 0 16 16h176a16 16 0 0 0 16-16V56a16 16 0 0 0-16-16m-14.77 130.26c-5.63 9-14.33 13.74-25.16 13.74c-20.73 0-34.81-25.31-49.72-52.11C115.47 112.33 101.93 88 90.61 88C78.18 88 64 116.88 64 142.21c0 8.26 1.5 15 4.34 19.56C71 166 74.68 168 79.93 168c6.08 0 13.52-7 22.74-21.51a8 8 0 0 1 13.49 8.59C99.84 180.71 88.22 184 79.93 184c-10.83 0-19.53-4.75-25.16-13.74c-4.43-7.08-6.77-16.78-6.77-28a103.1 103.1 0 0 1 11-45.2C67.34 80.9 78.57 72 90.61 72c20.73 0 34.81 25.31 49.72 52.11c10.88 19.55 24.42 43.89 35.74 43.89c5.25 0 8.93-2 11.59-6.23c2.84-4.53 4.34-11.3 4.34-19.56C192 116.88 177.82 88 165.39 88c-3.4 0-7.35 2.31-11.74 6.88a8 8 0 1 1-11.54-11.09C149.74 75.86 157.35 72 165.39 72c12 0 23.27 8.9 31.62 25.06a103.1 103.1 0 0 1 11 45.15c-.01 11.27-2.35 20.97-6.78 28.05"/></svg>
React
import type { SVGProps } from "react";
export function PhMetaLogoFill(props: SVGProps<SVGSVGElement>) {
return (
<svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M216 40H40a16 16 0 0 0-16 16v144a16 16 0 0 0 16 16h176a16 16 0 0 0 16-16V56a16 16 0 0 0-16-16m-14.77 130.26c-5.63 9-14.33 13.74-25.16 13.74c-20.73 0-34.81-25.31-49.72-52.11C115.47 112.33 101.93 88 90.61 88C78.18 88 64 116.88 64 142.21c0 8.26 1.5 15 4.34 19.56C71 166 74.68 168 79.93 168c6.08 0 13.52-7 22.74-21.51a8 8 0 0 1 13.49 8.59C99.84 180.71 88.22 184 79.93 184c-10.83 0-19.53-4.75-25.16-13.74c-4.43-7.08-6.77-16.78-6.77-28a103.1 103.1 0 0 1 11-45.2C67.34 80.9 78.57 72 90.61 72c20.73 0 34.81 25.31 49.72 52.11c10.88 19.55 24.42 43.89 35.74 43.89c5.25 0 8.93-2 11.59-6.23c2.84-4.53 4.34-11.3 4.34-19.56C192 116.88 177.82 88 165.39 88c-3.4 0-7.35 2.31-11.74 6.88a8 8 0 1 1-11.54-11.09C149.74 75.86 157.35 72 165.39 72c12 0 23.27 8.9 31.62 25.06a103.1 103.1 0 0 1 11 45.15c-.01 11.27-2.35 20.97-6.78 28.05"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M216 40H40a16 16 0 0 0-16 16v144a16 16 0 0 0 16 16h176a16 16 0 0 0 16-16V56a16 16 0 0 0-16-16m-14.77 130.26c-5.63 9-14.33 13.74-25.16 13.74c-20.73 0-34.81-25.31-49.72-52.11C115.47 112.33 101.93 88 90.61 88C78.18 88 64 116.88 64 142.21c0 8.26 1.5 15 4.34 19.56C71 166 74.68 168 79.93 168c6.08 0 13.52-7 22.74-21.51a8 8 0 0 1 13.49 8.59C99.84 180.71 88.22 184 79.93 184c-10.83 0-19.53-4.75-25.16-13.74c-4.43-7.08-6.77-16.78-6.77-28a103.1 103.1 0 0 1 11-45.2C67.34 80.9 78.57 72 90.61 72c20.73 0 34.81 25.31 49.72 52.11c10.88 19.55 24.42 43.89 35.74 43.89c5.25 0 8.93-2 11.59-6.23c2.84-4.53 4.34-11.3 4.34-19.56C192 116.88 177.82 88 165.39 88c-3.4 0-7.35 2.31-11.74 6.88a8 8 0 1 1-11.54-11.09C149.74 75.86 157.35 72 165.39 72c12 0 23.27 8.9 31.62 25.06a103.1 103.1 0 0 1 11 45.15c-.01 11.27-2.35 20.97-6.78 28.05"/></svg> </template>
CSS
.icon-meta-logo-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%20256%20256%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M216%2040H40a16%2016%200%200%200-16%2016v144a16%2016%200%200%200%2016%2016h176a16%2016%200%200%200%2016-16V56a16%2016%200%200%200-16-16m-14.77%20130.26c-5.63%209-14.33%2013.74-25.16%2013.74c-20.73%200-34.81-25.31-49.72-52.11C115.47%20112.33%20101.93%2088%2090.61%2088C78.18%2088%2064%20116.88%2064%20142.21c0%208.26%201.5%2015%204.34%2019.56C71%20166%2074.68%20168%2079.93%20168c6.08%200%2013.52-7%2022.74-21.51a8%208%200%200%201%2013.49%208.59C99.84%20180.71%2088.22%20184%2079.93%20184c-10.83%200-19.53-4.75-25.16-13.74c-4.43-7.08-6.77-16.78-6.77-28a103.1%20103.1%200%200%201%2011-45.2C67.34%2080.9%2078.57%2072%2090.61%2072c20.73%200%2034.81%2025.31%2049.72%2052.11c10.88%2019.55%2024.42%2043.89%2035.74%2043.89c5.25%200%208.93-2%2011.59-6.23c2.84-4.53%204.34-11.3%204.34-19.56C192%20116.88%20177.82%2088%20165.39%2088c-3.4%200-7.35%202.31-11.74%206.88a8%208%200%201%201-11.54-11.09C149.74%2075.86%20157.35%2072%20165.39%2072c12%200%2023.27%208.9%2031.62%2025.06a103.1%20103.1%200%200%201%2011%2045.15c-.01%2011.27-2.35%2020.97-6.78%2028.05%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%20256%20256%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M216%2040H40a16%2016%200%200%200-16%2016v144a16%2016%200%200%200%2016%2016h176a16%2016%200%200%200%2016-16V56a16%2016%200%200%200-16-16m-14.77%20130.26c-5.63%209-14.33%2013.74-25.16%2013.74c-20.73%200-34.81-25.31-49.72-52.11C115.47%20112.33%20101.93%2088%2090.61%2088C78.18%2088%2064%20116.88%2064%20142.21c0%208.26%201.5%2015%204.34%2019.56C71%20166%2074.68%20168%2079.93%20168c6.08%200%2013.52-7%2022.74-21.51a8%208%200%200%201%2013.49%208.59C99.84%20180.71%2088.22%20184%2079.93%20184c-10.83%200-19.53-4.75-25.16-13.74c-4.43-7.08-6.77-16.78-6.77-28a103.1%20103.1%200%200%201%2011-45.2C67.34%2080.9%2078.57%2072%2090.61%2072c20.73%200%2034.81%2025.31%2049.72%2052.11c10.88%2019.55%2024.42%2043.89%2035.74%2043.89c5.25%200%208.93-2%2011.59-6.23c2.84-4.53%204.34-11.3%204.34-19.56C192%20116.88%20177.82%2088%20165.39%2088c-3.4%200-7.35%202.31-11.74%206.88a8%208%200%201%201-11.54-11.09C149.74%2075.86%20157.35%2072%20165.39%2072c12%200%2023.27%208.9%2031.62%2025.06a103.1%20103.1%200%200%201%2011%2045.15c-.01%2011.27-2.35%2020.97-6.78%2028.05%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ph/meta-logo-fill.svg?color=%231a73e8&size=48