map pin area icon
map-pin-area-fill from Phosphor by Phosphor Icons · Fill · MIT Free for personal and commercial use.
- Name
- map-pin-area-fill
- Set
- Phosphor
- Style
- Fill
- Viewbox
- 256×256
- License
- MIT
5 other variants in Phosphor
Related icons in Phosphor
Use the map pin area icon
SVG
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M124 175a8 8 0 0 0 7.94 0c2.45-1.41 60-35 60-94.95A64 64 0 0 0 64 80c0 60 57.58 93.54 60 95m4-119a24 24 0 1 1-24 24a24 24 0 0 1 24-24m112 128c0 31.18-57.71 48-112 48S16 215.18 16 184c0-14.59 13.22-27.51 37.23-36.37a8 8 0 0 1 5.54 15C42.26 168.74 32 176.92 32 184c0 13.36 36.52 32 96 32s96-18.64 96-32c0-7.08-10.26-15.26-26.77-21.36a8 8 0 0 1 5.54-15C226.78 156.49 240 169.41 240 184"/></svg>
React
import type { SVGProps } from "react";
export function PhMapPinAreaFill(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="M124 175a8 8 0 0 0 7.94 0c2.45-1.41 60-35 60-94.95A64 64 0 0 0 64 80c0 60 57.58 93.54 60 95m4-119a24 24 0 1 1-24 24a24 24 0 0 1 24-24m112 128c0 31.18-57.71 48-112 48S16 215.18 16 184c0-14.59 13.22-27.51 37.23-36.37a8 8 0 0 1 5.54 15C42.26 168.74 32 176.92 32 184c0 13.36 36.52 32 96 32s96-18.64 96-32c0-7.08-10.26-15.26-26.77-21.36a8 8 0 0 1 5.54-15C226.78 156.49 240 169.41 240 184"/></svg>
);
}
Vue
<template> <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M124 175a8 8 0 0 0 7.94 0c2.45-1.41 60-35 60-94.95A64 64 0 0 0 64 80c0 60 57.58 93.54 60 95m4-119a24 24 0 1 1-24 24a24 24 0 0 1 24-24m112 128c0 31.18-57.71 48-112 48S16 215.18 16 184c0-14.59 13.22-27.51 37.23-36.37a8 8 0 0 1 5.54 15C42.26 168.74 32 176.92 32 184c0 13.36 36.52 32 96 32s96-18.64 96-32c0-7.08-10.26-15.26-26.77-21.36a8 8 0 0 1 5.54-15C226.78 156.49 240 169.41 240 184"/></svg> </template>
CSS
.icon-map-pin-area-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%22M124%20175a8%208%200%200%200%207.94%200c2.45-1.41%2060-35%2060-94.95A64%2064%200%200%200%2064%2080c0%2060%2057.58%2093.54%2060%2095m4-119a24%2024%200%201%201-24%2024a24%2024%200%200%201%2024-24m112%20128c0%2031.18-57.71%2048-112%2048S16%20215.18%2016%20184c0-14.59%2013.22-27.51%2037.23-36.37a8%208%200%200%201%205.54%2015C42.26%20168.74%2032%20176.92%2032%20184c0%2013.36%2036.52%2032%2096%2032s96-18.64%2096-32c0-7.08-10.26-15.26-26.77-21.36a8%208%200%200%201%205.54-15C226.78%20156.49%20240%20169.41%20240%20184%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%22M124%20175a8%208%200%200%200%207.94%200c2.45-1.41%2060-35%2060-94.95A64%2064%200%200%200%2064%2080c0%2060%2057.58%2093.54%2060%2095m4-119a24%2024%200%201%201-24%2024a24%2024%200%200%201%2024-24m112%20128c0%2031.18-57.71%2048-112%2048S16%20215.18%2016%20184c0-14.59%2013.22-27.51%2037.23-36.37a8%208%200%200%201%205.54%2015C42.26%20168.74%2032%20176.92%2032%20184c0%2013.36%2036.52%2032%2096%2032s96-18.64%2096-32c0-7.08-10.26-15.26-26.77-21.36a8%208%200%200%201%205.54-15C226.78%20156.49%20240%20169.41%20240%20184%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ph/map-pin-area-fill.svg?color=%231a73e8&size=48
