push pin icon

push-pin from Phosphor by Phosphor Icons · Regular · MIT Free for personal and commercial use.

Name: push-pin
Set: Phosphor
Style: Regular
Viewbox: 256×256
License: MIT

5 other variants in Phosphor

push-pin-bold push-pin-duotone push-pin-fill push-pin-light push-pin-thin

Related icons in Phosphor

push-pin-simple push-pin-simple-slash push-pin-slash

Use the push pin icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="m235.32 81.37l-60.69-60.68a16 16 0 0 0-22.63 0l-53.63 53.8c-10.66-3.34-35-7.37-60.4 13.14a16 16 0 0 0-1.29 23.78L85 159.71l-42.66 42.63a8 8 0 0 0 11.32 11.32L96.29 171l48.29 48.29A16 16 0 0 0 155.9 224h1.13a15.93 15.93 0 0 0 11.64-6.33c19.64-26.1 17.75-47.32 13.19-60L235.33 104a16 16 0 0 0-.01-22.63M224 92.69l-57.27 57.46a8 8 0 0 0-1.49 9.22c9.46 18.93-1.8 38.59-9.34 48.62L48 100.08c12.08-9.74 23.64-12.31 32.48-12.31A40.1 40.1 0 0 1 96.81 91a8 8 0 0 0 9.25-1.51L163.32 32L224 92.68Z"/></svg>

React

import type { SVGProps } from "react";

export function PhPushPin(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="m235.32 81.37l-60.69-60.68a16 16 0 0 0-22.63 0l-53.63 53.8c-10.66-3.34-35-7.37-60.4 13.14a16 16 0 0 0-1.29 23.78L85 159.71l-42.66 42.63a8 8 0 0 0 11.32 11.32L96.29 171l48.29 48.29A16 16 0 0 0 155.9 224h1.13a15.93 15.93 0 0 0 11.64-6.33c19.64-26.1 17.75-47.32 13.19-60L235.33 104a16 16 0 0 0-.01-22.63M224 92.69l-57.27 57.46a8 8 0 0 0-1.49 9.22c9.46 18.93-1.8 38.59-9.34 48.62L48 100.08c12.08-9.74 23.64-12.31 32.48-12.31A40.1 40.1 0 0 1 96.81 91a8 8 0 0 0 9.25-1.51L163.32 32L224 92.68Z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 256 256"><path fill="currentColor" d="m235.32 81.37l-60.69-60.68a16 16 0 0 0-22.63 0l-53.63 53.8c-10.66-3.34-35-7.37-60.4 13.14a16 16 0 0 0-1.29 23.78L85 159.71l-42.66 42.63a8 8 0 0 0 11.32 11.32L96.29 171l48.29 48.29A16 16 0 0 0 155.9 224h1.13a15.93 15.93 0 0 0 11.64-6.33c19.64-26.1 17.75-47.32 13.19-60L235.33 104a16 16 0 0 0-.01-22.63M224 92.69l-57.27 57.46a8 8 0 0 0-1.49 9.22c9.46 18.93-1.8 38.59-9.34 48.62L48 100.08c12.08-9.74 23.64-12.31 32.48-12.31A40.1 40.1 0 0 1 96.81 91a8 8 0 0 0 9.25-1.51L163.32 32L224 92.68Z"/></svg>
</template>

CSS

.icon-push-pin {
  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%22m235.32%2081.37l-60.69-60.68a16%2016%200%200%200-22.63%200l-53.63%2053.8c-10.66-3.34-35-7.37-60.4%2013.14a16%2016%200%200%200-1.29%2023.78L85%20159.71l-42.66%2042.63a8%208%200%200%200%2011.32%2011.32L96.29%20171l48.29%2048.29A16%2016%200%200%200%20155.9%20224h1.13a15.93%2015.93%200%200%200%2011.64-6.33c19.64-26.1%2017.75-47.32%2013.19-60L235.33%20104a16%2016%200%200%200-.01-22.63M224%2092.69l-57.27%2057.46a8%208%200%200%200-1.49%209.22c9.46%2018.93-1.8%2038.59-9.34%2048.62L48%20100.08c12.08-9.74%2023.64-12.31%2032.48-12.31A40.1%2040.1%200%200%201%2096.81%2091a8%208%200%200%200%209.25-1.51L163.32%2032L224%2092.68Z%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%22m235.32%2081.37l-60.69-60.68a16%2016%200%200%200-22.63%200l-53.63%2053.8c-10.66-3.34-35-7.37-60.4%2013.14a16%2016%200%200%200-1.29%2023.78L85%20159.71l-42.66%2042.63a8%208%200%200%200%2011.32%2011.32L96.29%20171l48.29%2048.29A16%2016%200%200%200%20155.9%20224h1.13a15.93%2015.93%200%200%200%2011.64-6.33c19.64-26.1%2017.75-47.32%2013.19-60L235.33%20104a16%2016%200%200%200-.01-22.63M224%2092.69l-57.27%2057.46a8%208%200%200%200-1.49%209.22c9.46%2018.93-1.8%2038.59-9.34%2048.62L48%20100.08c12.08-9.74%2023.64-12.31%2032.48-12.31A40.1%2040.1%200%200%201%2096.81%2091a8%208%200%200%200%209.25-1.51L163.32%2032L224%2092.68Z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

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