map pin icon

map-pin-thin from Phosphor by Phosphor Icons · Thin · MIT Free for personal and commercial use.

Name: map-pin-thin
Set: Phosphor
Style: Thin
Viewbox: 256×256
License: MIT

5 other variants in Phosphor

map-pin map-pin-bold map-pin-duotone map-pin-fill map-pin-light

The same icon in other sets

map-pinBoxIcons v2 map-pinBoxIcons v2 Solid map-pinFramework7 Icons map-pinFont Awesome 6 Solid map-pinFont Awesome Solid map-pinFeather Icons map-pin-outlineFlowbite Icons map-pin-20-filledFluent UI System Icons map-pinHeroIcons map-pinHuge Icons map-pinIconoir map-pinLine Awesome map-pinLucide map-pin-fillMingCute Icon map-pinMyna UI Icons map-pinPixelarticons map-pin-fillRemix Icon map-pinTabler Icons map-pinUnicons

Related icons in Phosphor

map-pin-area map-pin-line map-pin-plus map-pin-simple map-pin-simple-area map-pin-simple-line map-trifold

Use the map pin icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M128 68a36 36 0 1 0 36 36a36 36 0 0 0-36-36m0 64a28 28 0 1 1 28-28a28 28 0 0 1-28 28m0-112a84.09 84.09 0 0 0-84 84c0 30.42 14.17 62.79 41 93.62a250 250 0 0 0 40.73 37.66a4 4 0 0 0 4.58 0A250 250 0 0 0 171 197.62c26.81-30.83 41-63.2 41-93.62a84.09 84.09 0 0 0-84-84m37.1 172.23A254.6 254.6 0 0 1 128 227a254.6 254.6 0 0 1-37.1-34.81C73.15 171.8 52 139.9 52 104a76 76 0 0 1 152 0c0 35.9-21.15 67.8-38.9 88.23"/></svg>

React

import type { SVGProps } from "react";

export function PhMapPinThin(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="M128 68a36 36 0 1 0 36 36a36 36 0 0 0-36-36m0 64a28 28 0 1 1 28-28a28 28 0 0 1-28 28m0-112a84.09 84.09 0 0 0-84 84c0 30.42 14.17 62.79 41 93.62a250 250 0 0 0 40.73 37.66a4 4 0 0 0 4.58 0A250 250 0 0 0 171 197.62c26.81-30.83 41-63.2 41-93.62a84.09 84.09 0 0 0-84-84m37.1 172.23A254.6 254.6 0 0 1 128 227a254.6 254.6 0 0 1-37.1-34.81C73.15 171.8 52 139.9 52 104a76 76 0 0 1 152 0c0 35.9-21.15 67.8-38.9 88.23"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="M128 68a36 36 0 1 0 36 36a36 36 0 0 0-36-36m0 64a28 28 0 1 1 28-28a28 28 0 0 1-28 28m0-112a84.09 84.09 0 0 0-84 84c0 30.42 14.17 62.79 41 93.62a250 250 0 0 0 40.73 37.66a4 4 0 0 0 4.58 0A250 250 0 0 0 171 197.62c26.81-30.83 41-63.2 41-93.62a84.09 84.09 0 0 0-84-84m37.1 172.23A254.6 254.6 0 0 1 128 227a254.6 254.6 0 0 1-37.1-34.81C73.15 171.8 52 139.9 52 104a76 76 0 0 1 152 0c0 35.9-21.15 67.8-38.9 88.23"/></svg>
</template>

CSS

.icon-map-pin-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%22M128%2068a36%2036%200%201%200%2036%2036a36%2036%200%200%200-36-36m0%2064a28%2028%200%201%201%2028-28a28%2028%200%200%201-28%2028m0-112a84.09%2084.09%200%200%200-84%2084c0%2030.42%2014.17%2062.79%2041%2093.62a250%20250%200%200%200%2040.73%2037.66a4%204%200%200%200%204.58%200A250%20250%200%200%200%20171%20197.62c26.81-30.83%2041-63.2%2041-93.62a84.09%2084.09%200%200%200-84-84m37.1%20172.23A254.6%20254.6%200%200%201%20128%20227a254.6%20254.6%200%200%201-37.1-34.81C73.15%20171.8%2052%20139.9%2052%20104a76%2076%200%200%201%20152%200c0%2035.9-21.15%2067.8-38.9%2088.23%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%22M128%2068a36%2036%200%201%200%2036%2036a36%2036%200%200%200-36-36m0%2064a28%2028%200%201%201%2028-28a28%2028%200%200%201-28%2028m0-112a84.09%2084.09%200%200%200-84%2084c0%2030.42%2014.17%2062.79%2041%2093.62a250%20250%200%200%200%2040.73%2037.66a4%204%200%200%200%204.58%200A250%20250%200%200%200%20171%20197.62c26.81-30.83%2041-63.2%2041-93.62a84.09%2084.09%200%200%200-84-84m37.1%20172.23A254.6%20254.6%200%200%201%20128%20227a254.6%20254.6%200%200%201-37.1-34.81C73.15%20171.8%2052%20139.9%2052%20104a76%2076%200%200%201%20152%200c0%2035.9-21.15%2067.8-38.9%2088.23%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/ph/map-pin-thin.svg?color=%231a73e8&size=48