map pin simple area icon
map-pin-simple-area-thin from Phosphor by Phosphor Icons · Thin · MIT Free for personal and commercial use.
- Name
- map-pin-simple-area-thin
- Set
- Phosphor
- Style
- Thin
- Viewbox
- 256×256
- License
- MIT
5 other variants in Phosphor
Related icons in Phosphor
Use the map pin simple 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 99.77V176a4 4 0 0 0 8 0V99.77a36 36 0 1 0-8 0M128 36a28 28 0 1 1-28 28a28 28 0 0 1 28-28m108 140c0 12.46-11.73 23.83-33 32c-20.09 7.73-46.72 12-75 12s-54.89-4.25-75-12c-21.29-8.19-33-19.56-33-32c0-18.55 25.81-34.22 67.37-40.88a4 4 0 1 1 1.26 7.88C52.93 148.74 28 162.3 28 176c0 17.39 40.18 36 100 36s100-18.61 100-36c0-13.7-24.93-27.26-60.63-33a4 4 0 1 1 1.26-7.89C210.19 141.78 236 157.45 236 176"/></svg>
React
import type { SVGProps } from "react";
export function PhMapPinSimpleAreaThin(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 99.77V176a4 4 0 0 0 8 0V99.77a36 36 0 1 0-8 0M128 36a28 28 0 1 1-28 28a28 28 0 0 1 28-28m108 140c0 12.46-11.73 23.83-33 32c-20.09 7.73-46.72 12-75 12s-54.89-4.25-75-12c-21.29-8.19-33-19.56-33-32c0-18.55 25.81-34.22 67.37-40.88a4 4 0 1 1 1.26 7.88C52.93 148.74 28 162.3 28 176c0 17.39 40.18 36 100 36s100-18.61 100-36c0-13.7-24.93-27.26-60.63-33a4 4 0 1 1 1.26-7.89C210.19 141.78 236 157.45 236 176"/></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 99.77V176a4 4 0 0 0 8 0V99.77a36 36 0 1 0-8 0M128 36a28 28 0 1 1-28 28a28 28 0 0 1 28-28m108 140c0 12.46-11.73 23.83-33 32c-20.09 7.73-46.72 12-75 12s-54.89-4.25-75-12c-21.29-8.19-33-19.56-33-32c0-18.55 25.81-34.22 67.37-40.88a4 4 0 1 1 1.26 7.88C52.93 148.74 28 162.3 28 176c0 17.39 40.18 36 100 36s100-18.61 100-36c0-13.7-24.93-27.26-60.63-33a4 4 0 1 1 1.26-7.89C210.19 141.78 236 157.45 236 176"/></svg> </template>
CSS
.icon-map-pin-simple-area-thin {
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%2099.77V176a4%204%200%200%200%208%200V99.77a36%2036%200%201%200-8%200M128%2036a28%2028%200%201%201-28%2028a28%2028%200%200%201%2028-28m108%20140c0%2012.46-11.73%2023.83-33%2032c-20.09%207.73-46.72%2012-75%2012s-54.89-4.25-75-12c-21.29-8.19-33-19.56-33-32c0-18.55%2025.81-34.22%2067.37-40.88a4%204%200%201%201%201.26%207.88C52.93%20148.74%2028%20162.3%2028%20176c0%2017.39%2040.18%2036%20100%2036s100-18.61%20100-36c0-13.7-24.93-27.26-60.63-33a4%204%200%201%201%201.26-7.89C210.19%20141.78%20236%20157.45%20236%20176%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%2099.77V176a4%204%200%200%200%208%200V99.77a36%2036%200%201%200-8%200M128%2036a28%2028%200%201%201-28%2028a28%2028%200%200%201%2028-28m108%20140c0%2012.46-11.73%2023.83-33%2032c-20.09%207.73-46.72%2012-75%2012s-54.89-4.25-75-12c-21.29-8.19-33-19.56-33-32c0-18.55%2025.81-34.22%2067.37-40.88a4%204%200%201%201%201.26%207.88C52.93%20148.74%2028%20162.3%2028%20176c0%2017.39%2040.18%2036%20100%2036s100-18.61%20100-36c0-13.7-24.93-27.26-60.63-33a4%204%200%201%201%201.26-7.89C210.19%20141.78%20236%20157.45%20236%20176%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ph/map-pin-simple-area-thin.svg?color=%231a73e8&size=48
